
/* ==== BAR LMES カラーシステム：黒・金・白・茶・赤 ==== */
/* 【v5.0.0】カラーパレット：Champagne #EACEAA / Honey Garlic #85431E / Whiskey Sour #D39858 /
   Burnt Coffee #34150F / Balsamico #150C0C ＋ 視認性確保のための派生色 */
:root{
  --bg:#ffffff;
  --bg-panel:#ffffff;
  --bg-panel-2:#FBF4EA;
  --champagne:#EACEAA;
  --honey:#85431E;
  --whiskey:#D39858;
  --coffee:#34150F;
  --balsamico:#150C0C;
  --gold:#B06A2E;
  --gold-soft:#D39858;
  --gold-dim:#85431E;
  --line:#E6D5BC;
  --text:#150C0C;
  --text-dim:#6E5240;
  --brown:#34150F;
  --brown-soft:#85431E;
  --danger:#a5271f;
  --success:#34150F;
  --black:#150C0C;
  --font-body:'Noto Sans JP','Zen Kaku Gothic New','Hiragino Sans',sans-serif;
  --font-serif:'Shippori Mincho','Noto Serif JP','Hiragino Mincho ProN',serif;
  --font-pen:'Cormorant Garamond','EB Garamond','Shippori Mincho',serif;
}
*{box-sizing:border-box;}
html,body{background:transparent;color:var(--text);font-family:var(--font-body);-webkit-font-smoothing:antialiased;overscroll-behavior:none;}
::-webkit-scrollbar{width:6px;height:6px;}
::-webkit-scrollbar-thumb{background:#E0CDB0;border-radius:4px;}
::-webkit-scrollbar-track{background:transparent;}
.serif{font-family:var(--font-serif);font-weight:500;}
.pen{font-family:var(--font-pen);font-style:italic;font-weight:600;letter-spacing:.01em;}
.tracking-wide2{letter-spacing:.18em;}
.gold-text{color:var(--gold);}
.gold-grad{background:linear-gradient(120deg,#85431E,#D39858 35%,#EACEAA 50%,#D39858 65%,#85431E);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% auto;}
.bg-panel{background:var(--bg-panel);}
.bg-panel2{background:var(--bg-panel-2);}
.border-line{border-color:var(--line);}
.card{background:linear-gradient(160deg,#ffffff,var(--bg-panel-2));border:1px solid var(--line);border-radius:16px;box-shadow:0 6px 24px -14px rgba(21,12,12,.25);}
.card:hover{border-color:var(--gold-dim);}
.btn-gold{background:linear-gradient(135deg,#EACEAA,#D39858 45%,#B06A2E 80%);color:#2A1208;font-weight:700;border-radius:10px;transition:all .25s ease;box-shadow:0 4px 18px -6px rgba(176,106,46,.45);}
.btn-danger{background:linear-gradient(135deg,#e0574c,#a5271f 60%,#7a231d);color:#fff;font-weight:700;border-radius:10px;transition:all .25s ease;box-shadow:0 4px 18px -6px rgba(165,39,31,.5);}
.btn-info{background:linear-gradient(135deg,#4f8fe0,#2a5fa5 60%,#1e4373);color:#fff;font-weight:700;border-radius:10px;transition:all .25s ease;box-shadow:0 4px 18px -6px rgba(42,95,165,.5);}
.btn-info:hover{filter:brightness(1.08);transform:translateY(-1px);box-shadow:0 8px 22px -6px rgba(42,95,165,.6);}
.btn-info:active{transform:translateY(0);}
.btn-danger:hover{filter:brightness(1.08);transform:translateY(-1px);box-shadow:0 8px 22px -6px rgba(165,39,31,.6);}
.btn-danger:active{transform:translateY(0);}
.btn-gold:hover{filter:brightness(1.08);transform:translateY(-1px);box-shadow:0 8px 22px -6px rgba(176,106,46,.55);}
.btn-gold:active{transform:translateY(0);}
.btn-ghost{background:#ffffff;border:1px solid var(--line);color:var(--text);border-radius:10px;transition:all .2s ease;}
.btn-ghost:hover{border-color:var(--gold-dim);background:rgba(176,106,46,.06);}
.input-dark{background:#ffffff;border:1px solid #E0CDB0;color:var(--text);border-radius:8px;}
.input-dark:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(176,106,46,.14);}
.nav-card{background:linear-gradient(160deg,#ffffff,#FBF4EA);border:1px solid var(--line);border-radius:18px;transition:all .3s cubic-bezier(.2,.8,.2,1);cursor:pointer;position:relative;overflow:hidden;}
.nav-card::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 30% 20%,rgba(176,106,46,.10),transparent 60%);opacity:0;transition:opacity .35s;}
.nav-card:hover{transform:translateY(-4px);border-color:var(--gold-dim);box-shadow:0 16px 34px -18px rgba(52,21,15,.35);}
.nav-card:hover::before{opacity:1;}
.fade-in{animation:fadeIn .45s ease both;}
@keyframes fadeIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}
.fade-scale{animation:fadeScale .5s cubic-bezier(.2,.8,.2,1) both;}
@keyframes fadeScale{from{opacity:0;transform:scale(.96);}to{opacity:1;transform:scale(1);}}
/* ==== シャンパンの泡が立ち上る背景アニメーション（全画面共通） ==== */
/* ==== 会計完了済みの伝票（黒寄りの濃いグレー背景）の文字色を見やすく調整 ==== */
.ticket-closed-dark *:not(.stamp):not(.gold-text){color:#F3E1C9 !important;}
/* 内側のカード（セット料金・品目・合計欄など）は背景が明るいままなので、
   その中の文字は黒にして視認性を保つ */
.ticket-closed-dark .card *:not(.stamp):not(.gold-text){color:#150C0C !important;}
.ticket-closed-dark .gold-text{color:#EACEAA !important;}
/* ボタン類は自身の背景色を持つため、黒背景上でも本来のデザインの文字色を維持する
   （「伝票一覧へ戻る」等の白背景ボタンが白文字になって見えなくなる問題の修正） */
.ticket-closed-dark .btn-ghost, .ticket-closed-dark .btn-ghost *{color:#150C0C !important;}
.ticket-closed-dark .btn-gold, .ticket-closed-dark .btn-gold *{color:#150C0C !important;}
.ticket-closed-dark .btn-danger, .ticket-closed-dark .btn-danger *,
.ticket-closed-dark .btn-info, .ticket-closed-dark .btn-info *{color:#ffffff !important;}
.ticket-closed-dark input, .ticket-closed-dark select, .ticket-closed-dark textarea{color:#150C0C !important;}
/* ==== 指示出しメッセージの浮遊吹き出し ==== */
.float-bubble{position:fixed;left:14px;z-index:9000;display:inline-flex;align-items:center;gap:7px;
  border-radius:9999px;padding:11px 16px;font-weight:800;font-size:12.5px;cursor:pointer;user-select:none;
  box-shadow:0 10px 28px rgba(0,0,0,.22);animation:bubbleFloat 3.4s ease-in-out infinite;}
.float-bubble:active{transform:scale(.96);}
@keyframes bubbleFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.float-bubble.notice{background:linear-gradient(160deg,#FFFBF5,#F3E1C9);border:1px solid #85431E;color:#34150F;}
.float-bubble.notice::after{content:'';position:absolute;left:18px;bottom:-6px;width:11px;height:11px;background:#F3E1C9;
  border-right:1px solid #85431E;border-bottom:1px solid #85431E;transform:rotate(45deg);border-radius:2px;}
.float-bubble.admin-send{background:linear-gradient(135deg,#EACEAA,#B06A2E 55%,#85431E);color:#150C0C;border:1px solid #85431E;}
.float-bubble.admin-send::after{content:'';position:absolute;left:18px;bottom:-6px;width:11px;height:11px;background:#85431E;
  border-right:1px solid #85431E;border-bottom:1px solid #85431E;transform:rotate(45deg);border-radius:2px;}
.bubble-dot{width:8px;height:8px;border-radius:50%;background:#d90429;box-shadow:0 0 6px rgba(217,4,41,.85);animation:ybcPulse 1.4s ease-in-out infinite;flex:none;}
/* ==== LINE風チャット表示（指示出しメッセージ） ==== */
.chat-row{display:flex;flex-direction:column;align-items:flex-start;margin-bottom:12px;}
.chat-row.own{align-items:flex-end;}
.chat-bubble{position:relative;max-width:82%;padding:10px 14px;border-radius:16px;font-size:14px;font-weight:600;white-space:pre-wrap;word-break:break-word;box-shadow:0 2px 8px rgba(0,0,0,.06);}
.chat-bubble.other{background:#ffffff;border:1px solid var(--line);border-top-left-radius:4px;}
.chat-bubble.own{background:linear-gradient(160deg,#F5E4CB,#EACEAA);border:1px solid #85431E;border-top-right-radius:4px;color:#34150F;}
.chat-meta{font-size:10px;color:#8A6A55;font-weight:700;margin:2px 4px;}
.chat-reactions{display:flex;gap:4px;margin-top:4px;flex-wrap:wrap;}
.chat-reaction-pill{background:#fff;border:1px solid var(--line);border-radius:9999px;padding:2px 8px;font-size:11px;font-weight:700;cursor:pointer;}
.chat-reaction-pill.mine{border-color:#85431E;background:rgba(176,106,46,.14);}
.reaction-picker{display:inline-flex;gap:8px;background:#fff;border:1px solid var(--line);border-radius:9999px;padding:6px 12px;box-shadow:0 6px 18px rgba(0,0,0,.15);margin-top:5px;}
.reaction-picker button{font-size:19px;line-height:1;}
.chat-img{display:block;max-width:100%;max-height:240px;border-radius:12px;cursor:pointer;margin-bottom:2px;}
/* ==== YBCサイレン（回転灯＋点滅発光） ==== */
.ybc-siren{display:inline-block;position:relative;width:20px;height:20px;border-radius:50%;
  background:radial-gradient(circle at 50% 38%, #ff8a80, #d90429 65%, #8f0716 100%);
  box-shadow:0 0 8px rgba(255,0,0,.8);animation:ybcPulse 1s ease-in-out infinite;vertical-align:middle;overflow:hidden;}
.ybc-siren::before{content:'';position:absolute;inset:-3px;border-radius:50%;
  background:conic-gradient(rgba(255,255,255,.95) 0deg 45deg, rgba(255,255,255,0) 45deg 360deg);
  animation:ybcSweep .9s linear infinite;}
@keyframes ybcSweep{to{transform:rotate(360deg)}}
@keyframes ybcPulse{0%,100%{box-shadow:0 0 6px rgba(255,0,0,.65)}50%{box-shadow:0 0 16px rgba(255,0,0,1),0 0 30px rgba(255,80,0,.85)}}
/* ==== 出退勤の漫画オノマトペ演出（シュッキィィン!!／タイキィイィン!） ==== */
.punch-fx-overlay{position:fixed;inset:0;z-index:9800;pointer-events:none;display:flex;align-items:center;justify-content:center;overflow:hidden;animation:punchOverlayFade 2.1s ease-in forwards;}
@keyframes punchOverlayFade{0%,72%{opacity:1}100%{opacity:0}}
.punch-fx-burst{position:absolute;width:150vmax;height:150vmax;border-radius:50%;opacity:0;animation:punchBurst 2s ease-out forwards;}
.punch-fx-burst.fx-in{background:repeating-conic-gradient(rgba(255,204,0,.4) 0deg 5deg, rgba(255,255,255,0) 5deg 13deg), radial-gradient(circle, rgba(255,236,150,.75) 0%, rgba(255,236,150,0) 55%);}
.punch-fx-burst.fx-out{background:repeating-conic-gradient(rgba(157,78,221,.42) 0deg 5deg, rgba(255,255,255,0) 5deg 13deg), radial-gradient(circle, rgba(214,170,255,.75) 0%, rgba(214,170,255,0) 55%);}
@keyframes punchBurst{0%{transform:scale(.05) rotate(0deg);opacity:0}10%{opacity:1}75%{opacity:.85}100%{transform:scale(1) rotate(30deg);opacity:0}}
.punch-fx-center{position:relative;display:flex;flex-direction:column;align-items:center;gap:14px;}
.punch-fx-text{display:flex;transform:rotate(-7deg) skewX(-6deg);filter:drop-shadow(0 10px 18px rgba(0,0,0,.35));}
.punch-fx-text span{display:inline-block;font-weight:900;font-size:clamp(40px,12vw,110px);line-height:1;animation:punchChar .5s cubic-bezier(.2,2.6,.4,1) both;}
@keyframes punchChar{0%{transform:scale(.1) translateY(50px) rotate(18deg);opacity:0}60%{transform:scale(1.28) translateY(-8px) rotate(-4deg);opacity:1}100%{transform:scale(1) translateY(0) rotate(0)}}
.fx-in .punch-fx-text span{color:#ffd400;background:linear-gradient(180deg,#fff3a3 0%,#ffd400 40%,#ff9500 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;-webkit-text-stroke:3px #5b3a00;text-shadow:0 0 24px rgba(255,196,0,.85);}
.fx-out .punch-fx-text span{color:#b366ff;background:linear-gradient(180deg,#ecd7ff 0%,#b366ff 40%,#6d28d9 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;-webkit-text-stroke:3px #2a0a4d;text-shadow:0 0 24px rgba(168,85,247,.9);}
.punch-fx-sub{background:#fff;border:2px solid #2a0a4d;color:#2a0a4d;font-weight:800;font-size:clamp(15px,4vw,22px);padding:8px 22px;border-radius:9999px;transform:rotate(-3deg);box-shadow:0 8px 20px rgba(0,0,0,.25);animation:punchChar .55s .5s cubic-bezier(.2,2.4,.4,1) both;}
/* ==== マスコットキャラクターが画面のあちこちにゆっくりぴょこぴょこ現れる演出 ==== */
.mascot-pop{position:fixed;z-index:45;pointer-events:none;width:64px;opacity:0;
  image-rendering:pixelated;image-rendering:crisp-edges;
  filter:drop-shadow(0 6px 10px rgba(0,0,0,.25));
  animation-name:mascotHop; animation-timing-function:ease-in-out; animation-fill-mode:forwards;}
@keyframes mascotHop{
  0%{ opacity:0; transform:translateY(24px) scale(.7); }
  12%{ opacity:1; transform:translateY(0) scale(1); }
  30%{ transform:translateY(-16px) scale(1); }
  42%{ transform:translateY(0) scale(1); }
  60%{ transform:translateY(-11px) scale(1); }
  72%{ transform:translateY(0) scale(1); }
  88%{ opacity:1; transform:translateY(0) scale(1); }
  100%{ opacity:0; transform:translateY(14px) scale(.85); }
}
.champagne-bg{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;
  background:linear-gradient(to top, #D39858 0%, #E3B57E 12%, #EACEAA 26%, #F3E1C9 42%, #FBF4EA 60%, #ffffff 82%);}
.champagne-bg .bubble{position:absolute;bottom:-60px;border-radius:50%;
  background:radial-gradient(circle at 32% 28%, rgba(255,255,255,.95), rgba(255,210,140,.25) 60%, rgba(255,210,140,.05) 100%);
  box-shadow:0 0 4px rgba(255,255,255,.4) inset;
  animation-name:bubbleRise; animation-timing-function:linear; animation-iteration-count:infinite;}
@keyframes bubbleRise{
  0%{ transform:translate(0,0); opacity:0; }
  8%{ opacity:var(--maxop,.85); }
  92%{ opacity:calc(var(--maxop,.85) * .6); }
  100%{ transform:translate(var(--drift,12px),-115vh); opacity:0; }
}
/* 【v5.0.0】ロード画面：光の粒子が集まってロゴになる演出（canvas）＋ロゴ本体のフェードイン */
#opening{position:fixed;inset:0;background:radial-gradient(ellipse at 50% 40%,#2A1208 0%,#150C0C 60%,#0B0606 100%);z-index:9999;display:flex;align-items:center;justify-content:center;flex-direction:column;overflow:hidden;}
#opening .logo-anim{position:relative;opacity:0;animation:logoFade 2.4s ease forwards;}
#opening-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;}
@keyframes logoFade{0%,52%{opacity:0;transform:scale(.97);}70%{opacity:1;transform:scale(1);}100%{opacity:1;transform:scale(1);}}
.stamp{transform:rotate(-12deg);border:3px solid var(--danger);color:var(--danger);border-radius:10px;padding:2px 10px;font-weight:900;letter-spacing:.1em;opacity:.92;box-shadow:0 0 0 1px rgba(165,39,31,.2) inset;}
.pill{border-radius:999px;padding:2px 10px;font-size:11px;font-weight:600;letter-spacing:.03em;white-space:nowrap;display:inline-block;vertical-align:middle;} /* 【v5.6.0】バッジは途中で折り返さない */
.tab-btn{border-bottom:2px solid transparent;transition:all .2s;color:var(--text-dim);}
.tab-btn.active{border-color:var(--gold);color:var(--gold);}
table.ledger th{font-weight:500;color:var(--text-dim);font-size:12px;letter-spacing:.05em;}
table.ledger td,table.ledger th{padding:6px 8px;}
select.input-dark option{background:#ffffff;color:var(--text);}
.glow-divider{height:1px;background:linear-gradient(90deg,transparent,var(--gold-dim),transparent);}
.scrollbar-x{overflow-x:auto;}
.cal-cell{min-height:64px;border:1px solid var(--line);}
.cal-cell.sunday{background:rgba(165,39,31,.055);}
.cal-cell.today{box-shadow:inset 0 0 0 1px var(--gold);}
.cal-cell.alert{background:rgba(176,106,46,.10);box-shadow:inset 0 0 0 1px rgba(176,106,46,.4);}
/* ==== タイムカード管理画面：今日の行の金ネオン（ふんわり） ==== */
.tc-today-neon{border:1px solid rgba(176,106,46,.5) !important;border-radius:8px;animation:tcTodayNeon 5.5s ease-in-out infinite;}
@keyframes tcTodayNeon{
  0%,100%{border-color:rgba(176,106,46,.32);box-shadow:0 0 2px rgba(176,106,46,.1);}
  50%{border-color:rgba(176,106,46,.72);box-shadow:0 0 8px rgba(176,106,46,.32), inset 0 0 4px rgba(176,106,46,.1);}
}
/* ==== イベント設定日の赤ネオン枠（呼吸のようにふわっと・上品に） ==== */
.cal-cell.event-neon{border:1px solid rgba(214,69,93,.45);animation:eventNeon 5.5s ease-in-out infinite;border-radius:4px;}
@keyframes eventNeon{
  0%,100%{border-color:rgba(214,69,93,.3);box-shadow:0 0 2px rgba(214,69,93,.12);}
  50%{border-color:rgba(214,69,93,.6);box-shadow:0 0 7px rgba(214,69,93,.3), inset 0 0 4px rgba(214,69,93,.08);}
}
.event-neon-modal{border:1px solid rgba(214,69,93,.5) !important;animation:eventNeonModal 5.5s ease-in-out infinite;}
@keyframes eventNeonModal{
  0%,100%{border-color:rgba(214,69,93,.35) !important;box-shadow:0 0 4px rgba(214,69,93,.15), 0 24px 70px rgba(0,0,0,.4);}
  50%{border-color:rgba(214,69,93,.65) !important;box-shadow:0 0 10px rgba(214,69,93,.3), 0 24px 70px rgba(0,0,0,.4);}
}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#150C0C;border:1px solid var(--gold-dim);color:#F3E1C9;padding:10px 20px;border-radius:10px;z-index:99999;box-shadow:0 10px 30px rgba(0,0,0,.35);}
.modal-backdrop{position:fixed;inset:0;background:rgba(20,15,10,.55);backdrop-filter:blur(2px);z-index:9000;display:flex;align-items:center;justify-content:center;padding:16px;}
.modal-box{background:var(--bg-panel);border:1px solid var(--line);border-radius:16px;max-width:520px;width:100%;max-height:88vh;overflow-y:auto;}
.hoverline:hover{color:var(--gold);}
::placeholder{color:#A68E78;}
.spin-slow{animation:spin 6s linear infinite;}
@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
.logo-box{background:var(--black);border:1px solid var(--gold-dim);display:flex;align-items:center;justify-content:center;overflow:hidden;}
.logo-box img{width:100%;height:100%;object-fit:contain;padding:4px;}
.back-btn{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;color:var(--text-dim);font-size:14px;font-weight:700;border:1px solid var(--line);border-radius:9px;padding:8px 14px;background:#ffffff;transition:all .2s;}
.back-btn:hover{color:var(--gold);border-color:var(--gold-dim);}
/* ---- スマホ操作性向上（太字・大きめタップ領域） ---- */
html{font-size:16px;}
.btn-gold,.btn-ghost,.btn-danger,.btn-info{font-weight:700;min-height:44px;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;}
input.input-dark,select.input-dark,textarea.input-dark{font-size:16px;min-height:44px;}
textarea.input-dark{min-height:auto;}
label{font-weight:600;}
.card{font-weight:500;}

/* ==========================================================================
   WordPress専用スタイル調整
   専用のフルスクリーンページテンプレート（テーマのヘッダー・フッターを
   使わない完全独立ページ）と組み合わせて使うことを前提にしています。
   ========================================================================== */
html.bar-lmes-fullscreen, html.bar-lmes-fullscreen body{
  margin:0;
  padding:0;
  width:100%;
  min-height:100%;
  background:var(--bg);
}
#bar-lmes-root{
  font-family:var(--font-body);
  color:var(--text);
  line-height:1.5;
  width:100%;
  min-height:100vh;
  background:var(--bg);
}
#bar-lmes-root *{
  box-sizing:border-box;
}
#bar-lmes-root button{
  font-family:inherit;
  cursor:pointer;
}
#bar-lmes-root input, #bar-lmes-root select, #bar-lmes-root textarea{
  font-family:inherit;
}

/* 万一WordPressツールバー（管理バー）がまだ表示される場合の保険CSS */
html.bar-lmes-fullscreen #wpadminbar{ display:none !important; }
html.bar-lmes-fullscreen{ margin-top:0 !important; }

/* 【v4.9.0】押し忘れアラートのランプ */
@keyframes lmesBlink{0%,100%{opacity:1}50%{opacity:.2}}
.lamp-blink{animation:lmesBlink 1.1s ease-in-out infinite;}
.lamp-dot{display:inline-block;width:10px;height:10px;border-radius:9999px;vertical-align:middle;}
.lamp-dot-black{background:#150C0C;}
.lamp-dot-red{background:#d90429;box-shadow:0 0 8px rgba(217,4,41,.8);}

/* 【v4.9.0】カスタム時刻選択オーバーレイ */
.tp-cell{display:block;width:100%;padding:10px 0;text-align:center;font-weight:700;font-size:15px;color:#34150F;background:#FFFBF5;border-bottom:1px solid rgba(234,206,170,.35);}
.tp-cell-on{background:rgba(176,106,46,.18);color:#85431E;box-shadow:inset 3px 0 0 #B06A2E;}

/* 【v5.0.0】見出し・金額の書体 */
.heading-serif{font-family:var(--font-serif);letter-spacing:.06em;}
.amount{font-family:var(--font-pen);font-style:normal;font-weight:600;letter-spacing:.01em;}
/* 【v5.0.0】商品カード（伝票の商品選択） */
.prod-card{display:flex;gap:10px;align-items:center;width:100%;text-align:left;padding:9px 12px;border-bottom:1px solid rgba(234,206,170,.45);background:#FFFBF5;}
.prod-card:active{background:#F3E1C9;}
.prod-thumb{width:52px;height:52px;border-radius:10px;object-fit:cover;background:#F3E1C9;border:1px solid #EACEAA;flex:none;display:flex;align-items:center;justify-content:center;color:#85431E;font-size:18px;}
.prod-type{display:inline-block;font-size:9px;font-weight:800;padding:1px 6px;border-radius:999px;border:1px solid #EACEAA;color:#85431E;background:#FBF4EA;margin-right:4px;vertical-align:middle;}
.prod-type.red{background:#5a1f26;color:#F3E1C9;border-color:#5a1f26;}
.prod-type.white{background:#F7EFCF;color:#6E5240;border-color:#E0CDB0;}
.prod-type.rose{background:#F2C9CC;color:#6E2A33;border-color:#E7AEB3;}
.prod-type.sparkling{background:#EACEAA;color:#34150F;border-color:#D39858;}
.prod-type.whisky{background:#85431E;color:#F3E1C9;border-color:#85431E;}
.prod-type.food{background:#DDE6D5;color:#2E4A2B;border-color:#C5D3BA;}
.seg-tabs{display:flex;gap:4px;overflow-x:auto;padding:8px 10px;background:#FBF4EA;border-bottom:1px solid #EACEAA;-webkit-overflow-scrolling:touch;}
.seg-tab{flex:none;padding:6px 12px;border-radius:999px;font-size:12px;font-weight:800;border:1px solid #EACEAA;background:#fff;color:#6E5240;}
.seg-tab.on{background:#85431E;color:#F3E1C9;border-color:#85431E;}
/* 【v5.0.0】お客様セルフ登録（キオスクモード） */
.kiosk-wrap{min-height:100vh;background:linear-gradient(180deg,#FFFBF5,#F3E1C9);}

/* 【v5.2.0】伝票画面の選択ボタン（人数・新規/再来） */
.pick-btn{display:inline-flex;align-items:center;justify-content:center;padding:11px 8px;border-radius:10px;font-size:15px;font-weight:800;border:1.5px solid #EACEAA;background:#fff;color:#6E5240;line-height:1;transition:background .12s,color .12s,border-color .12s,transform .08s;-webkit-tap-highlight-color:transparent;}
.pick-btn:active{transform:scale(.97);}
.pick-btn.on{background:#85431E;color:#F3E1C9;border-color:#85431E;box-shadow:0 2px 8px rgba(133,67,30,.28);}
.pick-btn-sm{padding:8px 4px;font-size:13px;border-radius:8px;}
.ticket-closed-dark .pick-btn{background:rgba(255,251,245,.08);color:#EACEAA;border-color:rgba(234,206,170,.35);}
.ticket-closed-dark .pick-btn.on{background:#B06A2E;color:#150C0C;border-color:#B06A2E;}
/* 【v5.4.0】メッセージ吹き出しはアイコンのみ */
.float-bubble.icon-only{width:52px;height:52px;padding:0;justify-content:center;border-radius:50%;gap:0;}
.float-bubble.icon-only::after{display:none;}

/* 【v5.5.2】管理者メニュー（右から出るドロワー） */
.admin-drawer{width:min(88vw,340px);height:100%;max-height:100vh;overflow-y:auto;background:linear-gradient(160deg,#FFFBF5,#FBF4EA);border-left:1px solid #EACEAA;padding:16px 14px 28px;box-shadow:-18px 0 40px rgba(21,12,12,.35);animation:drawerIn .22s cubic-bezier(.2,.8,.2,1);-webkit-overflow-scrolling:touch;}
@keyframes drawerIn{from{transform:translateX(40px);opacity:0}to{transform:translateX(0);opacity:1}}

/* 【v5.5.3】トップのカード並び替え */
.nav-card.nav-edit{cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;animation:wobble 1.6s ease-in-out infinite;border-style:dashed;}
.nav-card.nav-edit:hover{transform:none;}
.nav-card.dragging{z-index:50;cursor:grabbing;box-shadow:0 24px 48px -16px rgba(52,21,15,.55);animation:none;transition:none;opacity:.95;}
.nav-handle{position:absolute;top:10px;right:12px;color:#B06A2E;font-size:16px;}
@keyframes wobble{0%,100%{transform:rotate(-.6deg)}50%{transform:rotate(.6deg)}}

/* 【v5.8.0】ふりがなルビ・検索一致の強調 */
ruby.cu-ruby{ruby-position:over;}
ruby.cu-ruby rt{font-size:.5em;font-weight:700;color:#8A6A55;letter-spacing:.04em;font-family:inherit;}
mark.cu-hit{background:#FFE08A;color:inherit;border-radius:3px;padding:0 1px;}

/* ============================================================
   【v5.9.0】伝票画面（ticket-sheet）：紙の背景・角丸なし・濃茶の見出し・高さを揃える
   ============================================================ */
.ticket-sheet{background:#F3EEE4 url(../img/paper-texture.jpg) center top/cover no-repeat;padding:0 0 28px;}
.ticket-sheet, .ticket-sheet *{border-radius:0 !important;}
.ticket-sheet .tk-inner{padding:14px 14px 0;}
@media (min-width:640px){ .ticket-sheet .tk-inner{padding:18px 20px 0;} }
.ticket-sheet .card{background:rgba(255,253,248,.80);box-shadow:0 2px 10px -6px rgba(21,12,12,.25);}
.tk-title{position:relative;background:#34150F;color:#F3E1C9;text-align:center;padding:12px 12px 10px;}
.tk-title-main{font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic",Meiryo,sans-serif;font-size:15px;font-weight:800;letter-spacing:.12em;}
.tk-title-clock{font-family:"Hiragino Sans","Noto Sans JP",sans-serif;font-size:11px;font-weight:600;color:#D7B48A;margin-top:3px;letter-spacing:.04em;font-variant-numeric:tabular-nums;}
.tk-title-action{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:11px;font-weight:700;color:#EACEAA;text-decoration:underline;}
.tk-launch{display:flex;align-items:center;justify-content:center;min-height:52px;font-size:16px;font-weight:800;}
.tk-launch-live{background:linear-gradient(160deg,#7A1F2B,#4A0D17);color:#FBE9EC;border:1px solid #2E060D;box-shadow:0 4px 14px -6px rgba(74,13,23,.7);}
.tk-launch-closed{background:#2b2420;color:#EACEAA;border:1px solid #150C0C;}
.tk-live-dot{width:9px;height:9px;border-radius:50% !important;background:#FF6B7A;margin-right:8px;box-shadow:0 0 0 0 rgba(255,107,122,.7);animation:tkPulse 1.6s infinite;}
@keyframes tkPulse{0%{box-shadow:0 0 0 0 rgba(255,107,122,.7)}70%{box-shadow:0 0 0 8px rgba(255,107,122,0)}100%{box-shadow:0 0 0 0 rgba(255,107,122,0)}}
.tk-warn{background:#8f0716;color:#fff;font-weight:800;text-align:center;padding:9px 8px;margin-bottom:12px;white-space:nowrap;font-size:clamp(12px,3.6vw,16px);letter-spacing:.02em;}
.tk-card{padding:0 !important;overflow:hidden;}
.tk-head{display:flex;align-items:center;justify-content:space-between;gap:8px;background:#4A2416;color:#F3E1C9;font-size:13px;font-weight:800;padding:0 10px;min-height:34px;letter-spacing:.04em;}
.tk-head-black{background:#111;color:#fff;position:relative;justify-content:center;min-height:40px;}
.tk-head-center{font-size:14px;letter-spacing:.12em;}
.tk-head-toggle{font-size:11px;font-weight:800;color:#EACEAA;border:1px solid rgba(234,206,170,.5);padding:4px 8px;}
.tk-head-black .tk-head-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);}
.tk-body{padding:10px;}
.tk-input{height:46px;padding:0 10px;box-sizing:border-box;min-width:0;width:100%;font-size:16px;}
.tk-time{-webkit-appearance:none;appearance:none;display:block;text-align:center;line-height:46px;}
.tk-time::-webkit-date-and-time-value{text-align:center;}
.tk-btn{height:46px;min-height:46px;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;line-height:1;}
.pick-btn.tk-btn{padding:0 6px;font-size:15px;}
.pick-btn.tk-btn-sm{height:40px;padding:0;font-size:14px;white-space:nowrap;}
.tk-hint{font-size:11px;font-weight:700;color:#B4530F;}
.tk-q{width:22px;height:22px;border-radius:50% !important;border:1px solid rgba(234,206,170,.7);color:#EACEAA;font-size:12px;font-weight:900;line-height:20px;text-align:center;flex:none;}
.tk-q.on{background:#EACEAA;color:#34150F;}
.tk-tip{font-size:11px;line-height:1.6;color:#6E5240;background:#FBF4EA;border-left:3px solid #D39858;padding:6px 8px;margin-bottom:8px;}
.tk-room{padding:8px 10px;background:rgba(251,244,234,.9);border-bottom:1px solid rgba(234,206,170,.7);}
.tk-item{padding:10px;border-bottom:1px solid rgba(234,206,170,.7);}
.tk-item-top{display:grid;grid-template-columns:1fr 1fr;gap:6px;}
.tk-item-bottom{display:grid;grid-template-columns:1fr 1.35fr 1.15fr;gap:6px;margin-top:6px;align-items:end;}
@media (max-width:420px){ .tk-item-top{grid-template-columns:1fr;} }
.tk-mini{display:flex;flex-direction:column;gap:2px;font-size:10px;font-weight:800;color:#8A6A55;min-width:0;}
.tk-qty{display:grid;grid-template-columns:40px 1fr 40px;gap:4px;}
.tk-qty-btn{width:40px;height:46px;font-size:22px;font-weight:900;color:#fff;display:inline-flex;align-items:center;justify-content:center;line-height:1;border:none;-webkit-tap-highlight-color:transparent;}
.tk-qty-btn:active{transform:scale(.94);}
.tk-minus{background:#1E5AA8;}
.tk-plus{background:#C0272D;}
.tk-pay-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.tk-pay{height:52px;display:flex;align-items:center;justify-content:center;white-space:nowrap;}
.tk-chip{display:inline-flex;align-items:center;gap:2px;font-size:12px;font-weight:800;padding:5px 8px;background:#fff;border:1px solid #BDD7EE;color:#1F4E79;}
.tk-chip.on{background:#1F4E79;color:#fff;border-color:#1F4E79;}
.tk-group{background:#EEF4FB;border:1px solid #BDD7EE;color:#1F4E79;padding:8px 10px;}
.tk-modal{background:#FFFBF5;border:1.5px solid #EACEAA;max-height:88vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 24px 70px rgba(0,0,0,.35);}
.tk-modal .tk-head-toggle{color:#EACEAA;}
.items-follower{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:60;background:#111;color:#fff;font-size:13px;font-weight:800;padding:12px 18px;box-shadow:0 8px 22px -6px rgba(0,0,0,.55);white-space:nowrap;transition:opacity .35s ease, transform .35s ease;}
.items-follower.gone{opacity:0;transform:translate(-50%,24px);pointer-events:none;}
.ticket-closed-dark.ticket-sheet{background:linear-gradient(160deg,#34150F,#150C0C);}
.ticket-closed-dark .tk-head{background:#150C0C;}
.ticket-closed-dark .card{background:rgba(255,251,245,.06);}
.card-undo{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:9700;display:flex;align-items:center;gap:10px;max-width:min(560px,94vw);background:#150C0C;color:#F3E1C9;font-size:13px;padding:12px 14px;box-shadow:0 12px 30px rgba(0,0,0,.45);border:1px solid #D39858;}
.card-undo-btn{flex:none;background:#EACEAA;color:#34150F;font-weight:900;padding:8px 12px;font-size:13px;}
.tk-qty input{padding:0 2px !important;text-align:center;}
.ticket-sheet input[type=number]::-webkit-inner-spin-button,.ticket-sheet input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0;}
.ticket-sheet input[type=number]{-moz-appearance:textfield;}
@media (max-width:420px){
  .tk-item-bottom{grid-template-columns:1fr 1.5fr 1.1fr;gap:5px;}
  .tk-qty{grid-template-columns:34px 1fr 34px;gap:3px;}
  .tk-qty-btn{width:34px;font-size:20px;}
  .tk-item-bottom .tk-input{padding:0 6px;}
}

/* ============================================================
   【v5.9.1】見た目の調整
   ============================================================ */
/* 注意文：細く・小さく・控えめに */
.tk-warn{background:transparent;color:#9B1C24;border-top:1px solid rgba(155,28,36,.35);border-bottom:1px solid rgba(155,28,36,.35);font-size:11.5px;font-weight:700;padding:5px 6px;margin-bottom:12px;letter-spacing:.06em;}
/* 見出し：画面端まで届く平らな帯（押せない）。ボタンとは色も形も変える */
.tk-head{background:#3A1C12;color:#E9D2B4;font-size:12px;min-height:30px;padding:0 12px;letter-spacing:.08em;box-shadow:none;}
.tk-head-black{background:#111;color:#fff;min-height:36px;}
/* 中身の余白を広げ、ボタンが枠の線にくっつかないように */
.tk-body{padding:14px 14px;}
.tk-room{padding:10px 14px;}
.tk-item{padding:12px 14px;}
@media (max-width:420px){ .tk-body{padding:12px;} .tk-item{padding:12px;} }
/* ボタン：白地＋はっきりした枠＋下に厚み（押せる形）。選択中は明るい銅色で凹む */
.ticket-sheet .pick-btn, .ticket-sheet .btn-ghost{background:#fff;border:1.5px solid #CDB08A;color:#4A2416;box-shadow:0 3px 0 #CDB08A;transition:transform .06s, box-shadow .06s;}
.ticket-sheet .pick-btn:active, .ticket-sheet .btn-ghost:active{transform:translateY(2px);box-shadow:0 1px 0 #CDB08A;}
.ticket-sheet .pick-btn.on{background:linear-gradient(180deg,#D68A3E,#B5631F);border-color:#8C4A15;color:#fff;box-shadow:inset 0 2px 5px rgba(0,0,0,.28);transform:translateY(2px);}
.ticket-sheet .tk-qty-btn{box-shadow:0 3px 0 rgba(0,0,0,.25);}
.ticket-sheet .tk-qty-btn:active{transform:translateY(2px);box-shadow:0 1px 0 rgba(0,0,0,.25);}
.ticket-sheet .tk-q{background:transparent;}
.ticket-sheet .input-dark{border:1.5px solid #E2D2BC;box-shadow:inset 0 1px 2px rgba(52,21,15,.06);}
/* 時刻：枠（ラベル）で高さを持ち、中の入力欄は上下中央。iPhone・iPad・PCで同じ見え方 */
.tk-timebox{display:flex;align-items:center;justify-content:center;height:48px;background:#fff;border:1.5px solid #E2D2BC;box-shadow:inset 0 1px 2px rgba(52,21,15,.06);cursor:pointer;overflow:hidden;}
.tk-timebox-sm{height:40px;}
.tk-time-in{-webkit-appearance:none;appearance:none;display:block;width:100%;height:auto;min-height:0;margin:0;padding:0 6px;border:0;background:transparent;font-size:18px;font-weight:700;color:#34150F;text-align:center;line-height:1.2;font-variant-numeric:tabular-nums;min-width:0;box-sizing:border-box;}
.tk-timebox-sm .tk-time-in{font-size:14px;}
.tk-time-in::-webkit-date-and-time-value{text-align:center;margin:0;min-height:1.2em;}
.tk-time-in::-webkit-datetime-edit{padding:0;}
.tk-time-in:focus{outline:none;}
.tk-timebox:focus-within{border-color:#B5631F;}
/* お会計の合計（お客様に見せる部分）：左右の線なし・ゆったり */
.tk-totals{background:rgba(255,253,248,.92);border-top:1.5px solid #CDB08A;border-bottom:1.5px solid #CDB08A;padding:18px 20px;}
@media (max-width:420px){ .tk-totals{padding:16px 16px;margin-left:-14px;margin-right:-14px;} }
.ticket-closed-dark .tk-totals{background:rgba(255,251,245,.06);}
/* 【v5.9.1】合計：画面端まで広げず、内側にたっぷり余白 */
.tk-totals{padding:22px 26px !important;}
@media (max-width:420px){ .tk-totals{margin-left:0 !important;margin-right:0 !important;padding:20px 22px !important;} }
.tk-totals > * + *{margin-top:8px;}

/* ===== 【v5.10.0】商品選択画面：種類ごとの色・泡・画像拡大 ===== */
.menu-sec-head{position:sticky;top:0;z-index:2;padding:8px 16px 6px;font-size:12px;font-weight:800;color:#85431E;background:#FBF4EA;border-bottom:1px solid #EACEAA;letter-spacing:.04em;}
.prod-card{position:relative;overflow:hidden;}
.prod-card .prod-price{color:#85431E;position:relative;}
.prod-card .prod-sub{color:#6E5240;}
.prod-card > *{position:relative;z-index:1;}
.prod-card.tone-red{background:linear-gradient(90deg,#F8DCDD,#FDF1F0);}
.prod-card.tone-white{background:linear-gradient(90deg,#E0EFD3,#F4FAEE);}
.prod-card.tone-orange,.prod-card.tone-orangesp{background:linear-gradient(90deg,#FBD9B4,#FEF0E0);}
.prod-card.tone-sparkling{background:linear-gradient(90deg,#FBEDA6,#FFF9DB);}
.prod-card.tone-whisky{background:linear-gradient(90deg,#3E2414,#5A3520);color:#F6E7D3;border-bottom-color:#2A170C;}
.prod-card.tone-shot{background:linear-gradient(90deg,#111,#2A2A2A);color:#F5F5F5;border-bottom-color:#000;}
.prod-card.tone-sake{background:linear-gradient(90deg,#DEDEDE,#F2F2F2);}
.prod-card.tone-fun{background:linear-gradient(100deg,#FFD6E0,#FFF1C2 25%,#D6F5D6 50%,#CFE8FF 75%,#E8D6FF);}
.prod-card.tone-whisky .prod-price,.prod-card.tone-shot .prod-price{color:#F3C98F;}
.prod-card.tone-whisky .prod-sub,.prod-card.tone-shot .prod-sub{color:#E3CDB4;}
.prod-card.tone-whisky .prod-type,.prod-card.tone-shot .prod-type{background:rgba(255,255,255,.12);color:#F6E7D3;border-color:rgba(255,255,255,.3);}
.prod-card.tone-red:active{background:#F1C3C5;}
.prod-card.tone-white:active{background:#CFE5BC;}
.prod-card.tone-orange:active,.prod-card.tone-orangesp:active{background:#F7C796;}
.prod-card.tone-sparkling:active{background:#F6E08A;}
.prod-card.tone-whisky:active{background:#2A170C;}
.prod-card.tone-shot:active{background:#000;}
.prod-card.tone-sake:active{background:#CFCFCF;}
.prod-type.orange{background:#F6B26B;color:#4A2308;border-color:#E89A4A;}
.prod-type.shot{background:#111;color:#F5F5F5;border-color:#111;}
.prod-type.fun{background:linear-gradient(90deg,#FFB3C6,#FFE38A,#A8E6A8,#9CCBFF,#CDA8FF);color:#34150F;border-color:#E0CDB0;}
/* 泡（スパークリング・オレンジ泡） */
.prod-card .bubbles{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;}
.prod-card .bubbles i{position:absolute;bottom:-12px;width:9px;height:9px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff 0 28%,rgba(255,255,255,.35) 45%,rgba(196,146,30,.45) 100%);box-shadow:0 0 0 1px rgba(176,128,24,.45);animation:lmesBubble 3.6s linear infinite;opacity:0;}
.prod-card.tone-orangesp .bubbles i{background:radial-gradient(circle at 35% 30%,#fff 0 28%,rgba(255,255,255,.35) 45%,rgba(214,110,30,.45) 100%);box-shadow:0 0 0 1px rgba(200,100,30,.45);}
.prod-card .bubbles i:nth-child(1){left:8%;animation-delay:0s;width:7px;height:7px;}
.prod-card .bubbles i:nth-child(2){left:22%;animation-delay:1.1s;}
.prod-card .bubbles i:nth-child(3){left:37%;animation-delay:2.3s;width:6px;height:6px;}
.prod-card .bubbles i:nth-child(4){left:51%;animation-delay:.6s;width:8px;height:8px;}
.prod-card .bubbles i:nth-child(5){left:64%;animation-delay:1.8s;width:7px;height:7px;}
.prod-card .bubbles i:nth-child(6){left:76%;animation-delay:2.9s;}
.prod-card .bubbles i:nth-child(7){left:86%;animation-delay:.3s;width:6px;height:6px;}
.prod-card .bubbles i:nth-child(8){left:94%;animation-delay:1.5s;width:8px;height:8px;}
@keyframes lmesBubble{0%{transform:translateY(0) translateX(0);opacity:0;}15%{opacity:.9;}50%{transform:translateY(-40px) translateX(3px);}100%{transform:translateY(-84px) translateX(-2px);opacity:0;}}
@media (prefers-reduced-motion: reduce){.prod-card .bubbles i{animation:none;opacity:.6;bottom:auto;top:30%;}}
/* 画像タップで拡大 */
.prod-thumb-tap{position:relative;flex:none;cursor:zoom-in;}
.prod-thumb-tap .prod-zoom-ico{position:absolute;right:-4px;bottom:-4px;width:20px;height:20px;border-radius:50%;background:#85431E;color:#fff;font-size:10px;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 3px rgba(0,0,0,.3);}
.menu-zoom-box{background:#FFFBF5;border-radius:14px;overflow:hidden;width:min(92vw,520px);max-height:92vh;display:flex;flex-direction:column;box-shadow:0 12px 40px rgba(0,0,0,.4);}
.menu-zoom-box img{width:100%;max-height:68vh;object-fit:contain;background:#1b1b1b;display:block;}
.menu-zoom-info{padding:10px 14px;border-bottom:1px solid #EACEAA;color:#34150F;}
.menu-zoom-info.tone-red{background:#F8DCDD}.menu-zoom-info.tone-white{background:#E0EFD3}.menu-zoom-info.tone-orange,.menu-zoom-info.tone-orangesp{background:#FBD9B4}.menu-zoom-info.tone-sparkling{background:#FBEDA6}.menu-zoom-info.tone-whisky{background:#3E2414;color:#F6E7D3}.menu-zoom-info.tone-shot{background:#111;color:#F5F5F5}.menu-zoom-info.tone-sake{background:#E6E6E6}.menu-zoom-info.tone-fun{background:linear-gradient(100deg,#FFD6E0,#FFF1C2,#D6F5D6,#CFE8FF,#E8D6FF)}
