:root{
  --bg:#0f172a; --surface:#0b1223; --panel:#111827; --card:#0b1223; --fg:#e5e7eb; --muted:#9ca3af; --primary:#60a5fa; --primary-fg:#0b1223; --border:#1f2937; --soft:#0b1223; --accent:#34d399; --danger:#ef4444;
  --ring: rgba(96,165,250,.35);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:radial-gradient(1000px 600px at 20% -10%, #1f2937 0%, transparent 60%), radial-gradient(800px 500px at 120% 10%, #111827 0%, transparent 60%), var(--bg);color:var(--fg);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,"Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic UI",sans-serif}

.site-header{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.6rem .9rem;background:rgb(248,240,225);backdrop-filter: blur(8px);border-bottom:1px solid var(--border)}
.site-left{display:flex;align-items:center;gap:.5rem}
.site-header.is-public{padding:.5rem .9rem;gap:.5rem}
.site-header.is-public .site-left{gap:.6rem}
.lang-select{padding:.35rem .75rem;border:1px solid rgba(0,0,0,.15);border-radius:999px;background:rgba(255,255,255,.9);color:#111;backdrop-filter:saturate(120%) blur(2px);box-shadow:0 1px 2px rgba(0,0,0,.06)}
.lang-select:hover{background:rgba(255,255,255,.9);border-color:rgba(0,0,0,.15)}
.lang-select:focus{outline:none;border-color:rgba(0,0,0,.15);box-shadow:none;background:rgba(255,255,255,.9)}
.lang-select{cursor:pointer}
.logo{height:28px;width:auto;display:block}
.logo-wrap{display:flex;align-items:center;gap:.5rem;color:inherit;text-decoration:none}
.site-title{font-weight:700}
.hamburger{border:1px solid var(--border);background:rgba(0,0,0,0.05);padding:.5rem;margin-right:.25rem;border-radius:10px;display:inline-flex;flex-direction:column;gap:4px}
.hamburger span{display:block;width:22px;height:2px;background:#111827;transition:.15s transform ease}
.hamburger:active span:first-child{transform:translateY(1px)}

.drawer{position:fixed;inset:0 40% 0 0;max-width:320px;transform:translateX(-100%);transition:.2s transform ease;background:rgba(17,24,39,.98);backdrop-filter: blur(8px);border-right:1px solid var(--border);z-index:60;padding-bottom:2rem}
.drawer.open{transform:translateX(0)}
.drawer-header{display:flex;align-items:center;justify-content:space-between;padding:.9rem;border-bottom:1px solid var(--border);font-weight:600}
.drawer ul{list-style:none;margin:0;padding:.5rem}
.drawer li{margin:.25rem 0}
.drawer a{display:block;padding:.75rem;border-radius:10px;color:inherit;text-decoration:none}
.drawer a:hover{background:#0f172a}
.backdrop{position:fixed;inset:0;background:rgba(255,255,255,.3);backdrop-filter: blur(2px);opacity:0;pointer-events:none;transition:.2s opacity ease;z-index:55}
.backdrop.show{opacity:1;pointer-events:auto}

.container{padding:1rem;max-width:960px;margin:0 auto}
.page-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin:.5rem 0 1rem}

.btn{display:inline-block;padding:.6rem .95rem;border:1px solid var(--border);border-radius:12px;background:linear-gradient(180deg, #111827, #0b1223);color:inherit;text-decoration:none;box-shadow:0 1px 0 #000 inset, 0 8px 16px rgba(0,0,0,.25);transition:.15s transform ease,.15s box-shadow ease}
.btn:active{transform:translateY(1px);box-shadow:0 0 0 #000 inset, 0 4px 10px rgba(0,0,0,.25)}
.btn.primary{background:linear-gradient(180deg, #3b82f6, #2563eb);border-color:#1d4ed8;color:#fff;box-shadow:0 1px 0 rgba(255,255,255,.1) inset, 0 8px 20px rgba(59,130,246,.35)}
.btn.success{background:linear-gradient(180deg, #34d399, #059669);border-color:#047857;color:#fff}
.btn.danger{background:linear-gradient(180deg, #ef4444, #b91c1c);border-color:#991b1b;color:#fff}
.btn.pill{border-radius:999px;padding:.4rem .8rem}
.link{border:none;background:none;color:var(--primary);text-decoration:underline;cursor:pointer;font:inherit}

.menu-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:.9rem}
@media(min-width:640px){.menu-list{grid-template-columns:1fr 1fr}}
.menu-card{border:1px solid var(--border);border-radius:14px;padding:1rem;display:flex;align-items:center;gap:.8rem;justify-content:space-between;background:linear-gradient(180deg, #111827, #0b1223);box-shadow:0 12px 24px rgba(0,0,0,.25)}
.menu-card{cursor:pointer}
/* Avoid iOS long-press callout and text selection on draggable cards */
.menu-card{ -webkit-user-select:none; user-select:none; -webkit-touch-callout:none }
.menu-card.published{
  background:linear-gradient(180deg, #1b2a47, #15264a);
  border-color: var(--accent);
  /* subtle emphasis ring without being flashy (green tone) */
  box-shadow: 0 12px 24px rgba(0,0,0,.28), 0 0 0 2px rgba(52,211,153,.2);
}
/* drag styles removed */
.menu-title{margin:.1rem 0 .2rem 0;font-size:1.2rem}
.menu-meta{color:var(--muted);font-size:.85rem}
.menu-stats{color:var(--muted)}
.menu-actions{display:flex;align-items:center;gap:.5rem}
.menu-actions .pub-wrap{display:flex;flex-direction:column;align-items:flex-start;gap:.25rem}
/* Right content grid on index card */
.menu-info{display:grid;grid-template-rows:auto auto auto auto;gap:.35rem;flex:1}
.menu-info .row{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.menu-info .row-phrases{gap:.6rem;flex-wrap:wrap}
.menu-info .row-phrases{justify-content:flex-start}
.menu-info .row .mini-label{font-size:.85rem;opacity:.85}
.menu-info .row .mini-note{font-size:.9rem;color:#aaa}
.menu-info .row-right{display:flex;align-items:center;gap:.5rem}
.tiny-link{background:none;border:0;color:var(--muted);text-decoration:underline;padding:0;font:inherit;cursor:pointer}
.tiny-link:hover{color:#fff}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--border);background:rgba(255,255,255,0.02);color:var(--muted);border-radius:10px;padding:.35rem}
.icon-btn:hover{color:#fff;border-color:#374151;background:#0f172a}
/* Public page cart (full-height, no border/padding) */
.cart-btn{gap:.35rem;border:none;background:transparent;padding:0;margin:0;border-radius:0;align-items:center;cursor:pointer}
.site-header.is-public .cart-btn{padding:.15rem .5rem;border-radius:12px}
.site-header.is-public .cart-btn:hover{background:rgba(0,0,0,.04)}
.site-header.is-public .cart-btn:active{transform:translateY(1px)}
.cart-icon{height:40px;width:auto;display:block;object-fit:contain}
.phrases-icon{height:40px;width:auto;display:block;object-fit:contain}
.cart-count{font-weight:700;color:#111827;font-size:.9rem}
/* Do not change colors on hover for cart button */
.cart-btn:hover{background:transparent; border-color:transparent; color:inherit}
.cart-btn:hover .cart-count{color:#111827}
.menu-delete{flex:0 0 auto}
.menu-card-thumb{flex:0 0 auto;width:88px;height:66px;border-radius:10px;overflow:hidden;border:1px solid var(--border);background:#0b1223;display:flex;align-items:center;justify-content:center}
.menu-card-thumb img{width:100%;height:100%;object-fit:cover;display:block}

.empty-state{padding:2rem 1rem;text-align:center;border:2px dashed var(--border);border-radius:14px;background:rgba(17,24,39,.6)}

/* Create page */
.uploader{border:2px dashed var(--border);border-radius:16px;padding:1.25rem;background:rgba(17,24,39,.6);outline:2px solid transparent}
.uploader.drag{border-color:var(--primary);box-shadow:0 0 0 3px var(--ring)}
.uploader-inner{display:flex;flex-direction:column;align-items:center;gap:.4rem}
.uploader-icon{color:var(--muted)}
.uploader-title{font-weight:600}
.uploader-sub{color:var(--muted);font-size:.95rem}
.uploader-preview{width:100%;margin-top:.75rem;border:1px solid var(--border);border-radius:14px;overflow:hidden;background:#0b1223}
#preview{display:block;width:100%;height:auto;max-height:360px;object-fit:contain;opacity:0;transition:opacity .2s ease}
.preview-meta{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.5rem .75rem;border-top:1px solid var(--border);color:var(--muted)}
.status{margin:.75rem 0;color:var(--muted)}
.visually-hidden-file{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.hero-section{margin:.9rem 0 1.2rem 0}
.hero-section h3{margin:.25rem 0 .5rem 0;font-size:1rem}

.items-editor{margin-top:1rem}
.items-head{display:flex;align-items:center;gap:.75rem;margin-bottom:.5rem}
#create-page .items-head{display:flex;align-items:center;justify-content:flex-end}
#create-page .title-head{margin:.75rem 0 .5rem}
#create-page .title-head label{display:block; width:100%; max-width:720px}
/* Add spacing between outside-of-category action rows in editor */
#create-page .items-editor > .actions{ margin-top:.75rem }
/* Horizontal rule between add and save/close */
#create-page .editor-sep{ border:0; border-top:2px solid rgba(96,165,250,.6); margin:1rem 0; box-shadow:0 0 0 1px rgba(96,165,250,.2) inset }
#create-page .editor-hr{ border:0; border-top:2px solid rgba(96,165,250,.6); margin:1rem 0; box-shadow:0 0 0 1px rgba(96,165,250,.2) inset }
.items-head input{padding:.5rem;border:1px solid var(--border);border-radius:8px;width:100%}
.items-head select{padding:.5rem;border:1px solid var(--border);border-radius:8px;width:100%}
.categories{display:flex;flex-direction:column;gap:.6rem}
.cat-rowwrap{ position:relative; }
.cat-card{border:1px solid var(--border);border-radius:10px;background:transparent;box-shadow:none;overflow:hidden}
.cat-card.open{border-color:var(--primary);box-shadow:0 0 0 3px var(--ring)}
.cat-head{width:100%;display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.9rem;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer}
.cat-card{}
.cat-head{cursor:pointer}
/* Avoid iOS long-press callout and text selection on draggable headers */
.cat-head{ -webkit-user-select:none; user-select:none; -webkit-touch-callout:none }
/* drag styles removed */
.cat-left{display:inline-flex;align-items:baseline;gap:.25rem}
.cat-head:hover{background:#0f172a}
.cat-title{font-weight:700}
.cat-count{color:var(--muted);font-size:.9rem}
.cat-chevron{transition:transform .15s ease}
.cat-card.open .cat-chevron{transform:rotate(180deg)}
.cat-body{max-height:0;overflow:hidden;transition:max-height .2s ease}
.cat-card.open .cat-body{max-height:9999px}
.items-list{list-style:none;margin:0;padding:0 .9rem .9rem .9rem;display:grid;gap:.6rem;grid-template-columns:repeat(auto-fill, minmax(140px, 1fr))}
.items-list.list-mode{grid-template-columns:1fr; gap:.4rem}

/* Create page: make category area lighter to distinguish items */
#create-page .cat-card{ background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.08) }
#create-page .cat-head{ background:rgba(255,255,255,.03) }
#create-page .items-list.list-mode{ padding:.5rem .75rem .85rem .75rem }
#create-page .item-row{ background:linear-gradient(180deg, #111827, #0b1223); border-color:var(--border) }
/* Category move buttons: outside card (right side) */
#create-page .cat-rowwrap{ position:relative; padding-right:28px }
#create-page .cat-move-outer{ position:absolute; right:2px; top:10px; display:flex; flex-direction:column; gap:.4rem; align-items:center }
#create-page .cat-move-outer .move-btn{ padding:0 .15rem; color:var(--muted); background:transparent; border:none }
#create-page .cat-move-outer .move-btn:hover{ color:#fff; background:rgba(255,255,255,.05) }
/* Hide up for first category, down for last (wrapper aware) */
#create-page .categories > .cat-rowwrap:first-child .cat-move-outer .btn-up{ display:none }
#create-page .categories > .cat-rowwrap:last-child .cat-move-outer .btn-down{ display:none }
/* drag styles removed */
.mini-item{border:1px solid var(--border);border-radius:12px;padding:.65rem .75rem;background:linear-gradient(180deg, #111827, #0b1223);display:grid;grid-template-columns:1fr auto;gap:.6rem;align-items:center;box-shadow:0 8px 16px rgba(0,0,0,.18)}
/* grid card (public or old editor) */
.card-item{border:1px solid var(--border);border-radius:12px;padding:.65rem .75rem;background:linear-gradient(180deg, #111827, #0b1223);box-shadow:0 8px 16px rgba(0,0,0,.18);display:grid;grid-template-rows:auto 1fr;gap:.5rem;aspect-ratio:1/1}
.card-item{cursor:pointer}
/* list row (new editor view) */
.item-row{border:1px solid var(--border);border-radius:10px;padding:.6rem .75rem;background:linear-gradient(180deg, #111827, #0b1223);box-shadow:0 6px 12px rgba(0,0,0,.16);display:flex;align-items:center;justify-content:space-between;gap:.75rem;cursor:pointer}
.item-row .mini-main{flex:1;min-width:0}
/* Move buttons: minimal, vertical stack */
.item-row .row-actions{display:flex;flex-direction:column;gap:.4rem;flex:0 0 auto;align-items:center}
.move-btn{border:none;background:transparent;color:var(--muted);border-radius:6px;padding:0 .15rem;font-size:.9rem;line-height:1;cursor:pointer}
.move-btn:hover{color:#fff; background:rgba(255,255,255,.05)}
.move-btn:active{transform:none}
/* FLIP animation helpers */
.anim-move{ transition: transform .18s ease; will-change: transform }
#create-page .item-row.flash{ box-shadow:0 0 0 2px rgba(96,165,250,.45) inset }
#create-page .cat-card.flash{ box-shadow:0 0 0 2px rgba(96,165,250,.45) inset }
@media (prefers-reduced-motion: reduce){
  .anim-move{ transition: none !important }
}
/* Hide up for first item, down for last item within a category list */
.items-list.list-mode > li.item-row:first-child .btn-up{ display:none }
.items-list.list-mode > li.item-row:last-child .btn-down{ display:none }
/* Avoid iOS long-press callout and text selection on draggable items */
.card-item{ -webkit-user-select:none; user-select:none; -webkit-touch-callout:none }
/* drag styles removed */
.no-select, .no-select *{user-select:none !important}
.mini-main{display:flex;flex-direction:column;gap:.1rem}
.mini-title{font-weight:600}
.mini-sub{color:var(--muted);font-size:.9rem}
.mini-thumb{width:64px;height:48px;border:1px solid var(--border);border-radius:8px;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#0b1223}
.mini-thumb img{width:100%;height:100%;object-fit:cover}
.card-item .mini-thumb{width:100%;height:100%;}

.stats{list-style:none;margin:0;padding:0}
.stats li{padding:.4rem 0}

/* Modal */
.modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;z-index:80}
.modal.open{display:flex}
.modal-backdrop{position:absolute;inset:0;background:rgba(255,255,255,.3);backdrop-filter: blur(2px)}
.modal-dialog{position:relative;max-width:680px;width:92%;background:linear-gradient(180deg, #111827, #0b1223);border:1px solid var(--border);border-radius:14px;box-shadow:0 20px 40px rgba(0,0,0,.35);padding:1rem}
.site-header.is-public ~ .container .modal-dialog,
.site-header.is-public ~ .container .modal-dialog *
{color:var(--fg)}
.site-header.is-public ~ .container .modal-dialog{background:linear-gradient(180deg, #111827, #0b1223);border:1px solid var(--border)}
.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem;padding-right:2rem;position:static}
/* Global close placement: near dialog top-right and larger */
.modal-dialog{position:relative}
.modal-dialog .modal-close{position:absolute;top:0;right:0;font-size:28px;padding:.15rem .35rem;line-height:1}
/* (Removed per-global modal close rule) */
/* public page: keep same global rule (already absolute on dialog) */
.modal-close{border:1px solid var(--border);background:transparent;border-radius:8px;color:inherit;padding:.2rem .5rem;cursor:pointer}
.modal-body{max-height:65vh;overflow:auto}
.modal-body{-webkit-overflow-scrolling:touch; overscroll-behavior: contain; touch-action: pan-y}
.modal-footer{display:flex;justify-content:flex-end;gap:.6rem;margin-top:.75rem}
.modal-footer .push-left{margin-right:auto}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.form-grid .full{grid-column:1/-1}
.form-grid input,.form-grid textarea{padding:.6rem;border:1px solid var(--border);border-radius:10px;width:100%;background:#0b1223;color:var(--fg)}
/* In phrases edit modal, stack one per row */
#phrEditModal .form-grid{grid-template-columns:1fr}
.thumb.large{width:100%;max-height:240px;display:flex;align-items:center;justify-content:center;border:1px dashed var(--border);border-radius:10px;background:#0b1223;margin:.5rem 0}
.thumb.large img{max-width:100%;max-height:240px}
.uploader-preview{position:relative}
.uploader-preview img{ display:block; max-width:100%; height:auto; transition: transform .15s ease; margin: 0 auto; }
.btn-row{display:flex;gap:.5rem;flex-wrap:wrap}

.i18n-section{margin-top:1rem;border-top:1px solid var(--border);padding-top:.75rem}
.i18n-section h3{margin:.25rem 0 .5rem 0;font-size:1rem}
.i18n-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.5rem;margin-bottom:.5rem}
/* streaming ui removed */

/* Waiting overlay */
.waiting-layer{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.3);backdrop-filter: blur(2px)}

/* Ensure quantity modal (public item modal) appears above cart modal */
#publicItemModal.modal{ z-index: 85; }
/* Keep items list modal behind edit modal when stacked */
#itemsListModal.modal{ z-index: 82; }
#editModal.modal{ z-index: 86; }
/* Wider dialog for items list on desktop */
#itemsListModal .modal-dialog{ max-width: 1200px; width: 96vw; }
.waiting-box{background:linear-gradient(180deg, #111827, #0b1223);border:1px solid var(--border);border-radius:14px;padding:1rem 1.25rem;display:flex;align-items:center;gap:.75rem;box-shadow:0 20px 40px rgba(0,0,0,.35)}
.diff-list{display:flex;flex-direction:column;gap:.75rem}
.diff-section{border:1px solid var(--border);border-radius:10px;padding:.6rem;background:rgba(17,24,39,.5)}
.diff-section h4{margin:.2rem 0 .5rem 0;font-size:1rem}
.diff-item{display:flex;gap:.6rem;align-items:flex-start;padding:.4rem 0;border-top:1px dashed var(--border)}
.diff-item:first-child{border-top:0}
.diff-item-details{color:var(--muted);font-size:.9rem}
.waiting-text{color:var(--fg)}
.spinner{width:20px;height:20px;border-radius:50%;border:3px solid rgba(255,255,255,.15);border-top-color:var(--primary);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
/* Public cart modal layout */
.cart-modal{display:flex;flex-direction:column;gap:.6rem}
.cart-head{display:flex;align-items:baseline;justify-content:flex-end}
.cart-price{font-weight:700}
.cart-qty{display:flex;align-items:center;gap:.5rem}
.qty-label{color:var(--muted);font-weight:700}
.cart-qty select{padding:.6rem .75rem;border:1px solid var(--border);border-radius:12px;background:#0b1223;color:var(--fg);font-size:1rem;min-width:72px}
.qty-quick{display:flex;align-items:center;gap:.45rem}
.qty-quick button{border:1px solid var(--border);background:#111827;color:var(--fg);border-radius:12px;padding:.45rem .7rem;cursor:pointer;font-size:1rem}
.qty-quick button:active{transform:translateY(1px)}
.cart-desc{white-space:pre-wrap;color:var(--fg)}
.cart-notes{white-space:pre-wrap;color:var(--muted)}
/* Cart modal list */
.cart-list{display:flex;flex-direction:column;gap:.4rem;margin-top:.25rem}
.cart-row{display:grid;grid-template-columns:1fr auto auto auto;align-items:center;gap:.6rem;border-bottom:1px dashed var(--border);padding:.35rem 0}
.cart-row-name{opacity:.95}
.cart-row-qty{color:var(--muted)}
.cart-row-price{font-weight:700}
.cart-actions{display:flex;align-items:center;gap:.35rem}
.icon-btn.small{padding:.25rem;border-radius:8px}
.icon-btn.small svg{display:block;width:16px;height:16px;color:var(--muted)}
.icon-btn.small:hover svg{color:#fff}
/* Emphasize edit/delete colors */
.cart-edit svg{color:#3b82f6 !important}
.cart-edit:hover svg{color:#60a5fa !important}
.cart-del svg{color:#ef4444 !important}
.cart-del:hover svg{color:#f87171 !important}
.cart-total{margin-top:.6rem;display:flex;justify-content:flex-end;gap:.6rem;font-weight:800}
.cart-total .label{color:var(--muted)}
/* Order display */
.order-display .modal-header{border-bottom:1px solid var(--border); background:#fff; color:#000; margin-right:2rem; padding-right:.75rem; justify-content:center}
/* Ensure order display title is clearly visible and not overlapped */
.order-display .modal-header h2{ color:#000; margin-right:0 }
.order-banner{margin:.5rem 0 1rem 0;padding:.5rem .75rem;border:1px dashed var(--border);border-radius:10px;text-align:center;font-weight:800;color:#eab308;background:rgba(234,179,8,.08)}
.order-content{display:grid;gap:1rem}
.order-cleared-note{font-size:.72rem;color:var(--muted);text-align:right;margin:.15rem 0 .35rem 0}
.order-section{border:1px solid var(--border);border-radius:12px;padding:.75rem;background:linear-gradient(180deg,#111827,#0b1223)}
.order-list{list-style:none;margin:0;padding:0;display:grid;gap:.35rem}
.order-row{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:.6rem}
.order-section.staff .order-name{font-size:1.6rem;font-weight:900}
.order-section.staff .order-qty{font-size:1.6rem;font-weight:900;color:var(--muted)}
.order-section.user{color:var(--muted)}
.order-section.user .order-name{font-size:1rem;font-weight:600;color:var(--muted)}

/* Public page overrides: force expected colors in order display */
.site-header.is-public ~ .container .modal-dialog.order-display .modal-header,
.site-header.is-public ~ .container .modal-dialog.order-display .modal-header h2{ color:#000 !important }
.site-header.is-public ~ .container .modal-dialog.order-display .order-section.user,
.site-header.is-public ~ .container .modal-dialog.order-display .order-section.user .order-name,
.site-header.is-public ~ .container .modal-dialog.order-display .order-section.user .order-qty{ color:var(--muted) !important }
.order-section.user .order-qty{font-size:1rem;font-weight:600;color:var(--muted)}
.phr-editor{}
/* Phrases editor category title larger, esp. on mobile */
.phr-editor .cat-title{ font-size:1.15rem }
@media(max-width:640px){ .phr-editor .cat-title{ font-size:1.28rem } }
/* Slightly larger tap target for category head in phrases editor */
.phr-editor .cat-head{ padding:1rem }
/* Unified lighter modal backdrop (applies globally) */

/* Public page: emphasize language selector */
.site-header.is-public .lang-select{
  background:linear-gradient(180deg, #3b82f6, #2563eb);
  color:#fff;
  border-color:#1d4ed8;
  font-weight:800;
  padding:.55rem 1rem;
  box-shadow:0 2px 10px rgba(59,130,246,.35), 0 0 0 3px rgba(59,130,246,.15);
}
.site-header.is-public .lang-select option{ color:#333; background:#fff; }
.site-header.is-public .lang-select:hover{filter:brightness(1.05)}
.site-header.is-public .lang-select:focus{box-shadow:0 0 0 3px rgba(59,130,246,.35)}

/* Public confirm dialog message */
.confirm-message{font-size:1.1rem;font-weight:800}

/* Public page: menu hero thumbnail (small) */
.hero-thumb{border:1px solid var(--border); background:transparent; padding:0; border-radius:10px; display:flex; align-items:center; justify-content:center; cursor:pointer}
.hero-thumb img{display:block; height:50px; width:auto; object-fit:contain; border-radius:10px}
#heroImageModal .modal-dialog{background:transparent; border:none; box-shadow:none; padding:0; max-width:92vw}
.hero-full{display:block; width:auto; height:auto; max-width:92vw; max-height:85vh; object-fit:contain; border:1px solid var(--border); border-radius:12px; margin:0 auto}
/* Public phrases modal */
.phr-list{list-style:none;margin:0;padding:.25rem .75rem .75rem .75rem;display:grid;gap:.35rem}
.phr-item{border:1px solid var(--border);border-radius:10px;padding:.5rem;background:linear-gradient(180deg,#111827,#0b1223)}
.phr-text{white-space:pre-wrap}
.phrases-caption{color:var(--muted); margin-bottom:.5rem; font-size:.95rem}
/* Phrase speak modal */
.speak-ja{font-size:2rem; line-height:1.4; font-weight:800; text-align:center; margin:.5rem 0}
.speak-foreign{color:var(--muted); font-size:1rem; text-align:center}
/* QR under menu card thumb */
.menu-qr{display:flex;align-items:center;justify-content:center;margin:.5rem 0 0 0}
.menu-qr img{display:block;width:120px;height:120px;border:1px solid var(--border);border-radius:8px;background:#fff}