/* Jetz Παραγγελίες — μενού πελάτη, κουζίνα, πάσο */
:root {
	/* Παλέτα */
	--jno-olive: #9F9446;
	--jno-rust: #7F4736;
	--jno-rose: #B18591;
	--jno-plum: #923568;
	--jno-aubergine: #5A393D;
	--jno-butter: #D8CD74;
	--jno-blue: #6A95C7;
	--jno-moss: #63604C;
	/* Παράγωγα (αποχρώσεις της ίδιας παλέτας) */
	--jno-olive-dark: #6F6630;
	--jno-plum-soft: #F3E3EA;
	--jno-butter-soft: #F4EFCF;
	--jno-cream: #F7F4EC;
	--jno-line: #E5DDD3;
	--jno-ink: #3E2629;
	--jno-night: #251A1C;
	--jno-night-2: #2F2225;
	--jno-night-3: #3B2B2F;
}
html, body.jno-app { margin: 0; padding: 0; }
body.jno-app {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans", Arial, sans-serif;
	-webkit-font-smoothing: antialiased; -webkit-tap-highlight-color: transparent;
	background: var(--jno-cream); color: var(--jno-ink); line-height: 1.35;
}
body.jno-page-kitchen, body.jno-page-pass { background: var(--jno-night); color: #F3ECEE; }
.jno-root *, .jno-root *::before, .jno-root *::after { box-sizing: border-box; }
.jno-root button { font: inherit; cursor: pointer; border: 0; }
.jno-root textarea, .jno-root select { font: inherit; }
.jno-loading { padding: 40px; text-align: center; opacity: .6; }

/* ---------- Toast ---------- */
.jno-toast { position: fixed; left: 50%; bottom: 96px; transform: translateX(-50%) translateY(20px); background: var(--jno-aubergine); color: #fff;
	padding: 12px 18px; border-radius: 12px; font-size: 15px; opacity: 0; pointer-events: none; transition: .25s; z-index: 100; max-width: 90vw; text-align: center; }
.jno-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.jno-dark .jno-toast, body.jno-page-kitchen .jno-toast, body.jno-page-pass .jno-toast { background: #fff; color: var(--jno-ink); bottom: 24px; }

/* =================== ΜΕΝΟΥ ΠΕΛΑΤΗ =================== */
#jno-menu { max-width: 560px; margin: 0 auto; min-height: 100vh; padding-bottom: 110px; }
.jm-head { background: var(--jno-header, #2E6B40); color: #fff; padding: calc(16px + env(safe-area-inset-top)) 18px 16px; }
.jm-head h1 { margin: 0; font-size: 22px; letter-spacing: .2px; }
.jm-head .jm-sub { margin-top: 4px; font-size: 14px; opacity: .8; }
.jm-pill { display: inline-block; background: var(--jno-butter); color: var(--jno-aubergine); border-radius: 999px; padding: 2px 10px; font-weight: 700; font-size: 13px; }
.jm-warn { margin: 12px; padding: 12px 14px; background: var(--jno-butter-soft); border-radius: 12px; font-size: 14px; }

.jm-track { padding: 0 12px; }
.jm-order { margin-top: 12px; border-radius: 14px; padding: 14px 16px; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.08); display: flex; gap: 12px; align-items: center; }
.jm-order .ic { font-size: 28px; }
.jm-order .tx { flex: 1; font-size: 14px; }
.jm-order .tx b { font-size: 16px; display: block; }
.jm-order .x { background: transparent; font-size: 20px; opacity: .5; padding: 4px 8px; }
.jm-order.ready { background: var(--jno-olive-dark); color: #fff; animation: jm-pulse 1.4s ease-in-out infinite; }
.jm-order.ready .tx b { font-size: 19px; }
.jm-order.served { opacity: .75; }
.jm-order.cancelled { background: var(--jno-plum-soft); }
@keyframes jm-pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(159,148,70,.7); } 50% { box-shadow: 0 0 0 8px rgba(159,148,70,0); } }
.jm-steps { display: flex; gap: 4px; margin-top: 6px; }
.jm-steps i { flex: 1; height: 4px; border-radius: 2px; background: var(--jno-line); }
.jm-steps i.on { background: var(--jno-olive); }

.jm-cats { position: sticky; top: 0; z-index: 5; background: var(--jno-cream); padding: 12px 12px 6px; display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; }
.jm-cats::-webkit-scrollbar { display: none; }
.jm-chip { flex: 0 0 auto; background: #fff; color: var(--jno-ink); border-radius: 999px; padding: 9px 16px; font-weight: 600; font-size: 15px; box-shadow: 0 1px 2px rgba(0,0,0,.08); }
.jm-chip.on { background: var(--jno-plum); color: #fff; }
.jm-chip.daily { background: var(--jno-butter-soft); color: var(--jno-moss); }
.jm-chip.daily.on { background: var(--jno-butter); color: var(--jno-aubergine); }
.jm-subs { display: flex; gap: 6px; overflow-x: auto; padding: 4px 12px 8px; scrollbar-width: none; }
.jm-subs::-webkit-scrollbar { display: none; }
.jm-subs .jm-chip { padding: 6px 12px; font-size: 13px; box-shadow: none; border: 1px solid var(--jno-line); background: transparent; }
.jm-subs .jm-chip.on { background: var(--jno-aubergine); border-color: var(--jno-aubergine); color: #fff; }

.jm-group { padding: 6px 12px 0; }
.jm-group h3 { margin: 14px 4px 8px; font-size: 13px; text-transform: uppercase; letter-spacing: .6px; color: var(--jno-rust); }
.jm-daily-hero { margin: 4px 12px 0; padding: 12px 14px; border-radius: 14px; background: var(--jno-butter); color: var(--jno-aubergine); border-left: 6px solid var(--jno-olive); font-weight: 600; }
.jm-daily-hero small { display: block; font-weight: 400; opacity: .85; }

.jm-prod { display: flex; gap: 12px; background: #fff; border-radius: 14px; padding: 12px; margin-bottom: 10px; box-shadow: 0 1px 3px rgba(0,0,0,.06); align-items: center; }
.jm-prod .img { width: 74px; height: 74px; border-radius: 10px; background: var(--jno-butter-soft) center/cover no-repeat; flex: 0 0 auto; }
.jm-prod .info { flex: 1; min-width: 0; }
.jm-prod .name { font-weight: 700; font-size: 16px; }
.jm-prod .desc { font-size: 13px; color: var(--jno-moss); margin-top: 2px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.jm-prod .meta { margin-top: 6px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.jm-prod .price { font-weight: 700; }
.jm-badge { font-size: 12px; font-weight: 700; padding: 3px 8px; border-radius: 999px; }
.jm-badge.low { background: var(--jno-plum-soft); color: var(--jno-plum); animation: jm-blink 1.6s ease-in-out infinite; }
.jm-badge.last { background: var(--jno-plum); color: #fff; }
.jm-badge.out { background: #e3e3e3; color: #777; }
.jm-badge.star { background: var(--jno-butter-soft); color: var(--jno-moss); }
@keyframes jm-blink { 50% { opacity: .55; } }
.jm-prod.out { background: #ececec; box-shadow: none; filter: grayscale(1); opacity: .6; }
.jm-prod.out .name { text-decoration: line-through; }
.jm-add { background: var(--jno-plum); color: #fff; width: 42px; height: 42px; border-radius: 12px; font-size: 24px; line-height: 1; flex: 0 0 auto; }
.jm-add:disabled { background: #D9CFD2; }
.jm-qty { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; }
.jm-qty button { width: 36px; height: 36px; border-radius: 10px; background: var(--jno-plum); color: #fff; font-size: 20px; }
.jm-qty button:disabled { background: #D9CFD2; }
.jm-qty span { min-width: 22px; text-align: center; font-weight: 700; font-size: 17px; }
.jm-empty { text-align: center; padding: 30px 20px; color: var(--jno-moss); }

.jm-bar { position: fixed; left: 0; right: 0; bottom: 0; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); z-index: 20; pointer-events: none; }
.jm-bar button { pointer-events: auto; display: flex; width: 100%; max-width: 536px; margin: 0 auto; justify-content: space-between; align-items: center;
	background: var(--jno-plum); color: #fff; font-weight: 800; font-size: 17px; padding: 16px 20px; border-radius: 16px; box-shadow: 0 6px 20px rgba(0,0,0,.2); }
.jm-bar .cnt { background: var(--jno-butter); color: var(--jno-aubergine); border-radius: 999px; padding: 2px 10px; margin-right: 8px; font-size: 14px; }

.jm-sheet-bg { position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 30; }
.jm-sheet { position: fixed; left: 0; right: 0; bottom: 0; max-width: 560px; margin: 0 auto; background: #fff; z-index: 31; border-radius: 20px 20px 0 0;
	max-height: 88vh; overflow-y: auto; padding: 18px 16px calc(18px + env(safe-area-inset-bottom)); }
.jm-sheet h2 { margin: 0 0 12px; font-size: 20px; display: flex; justify-content: space-between; align-items: center; }
.jm-sheet h2 button { background: transparent; font-size: 26px; padding: 0 6px; }
.jm-line { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--jno-line); }
.jm-line .n { flex: 1; font-weight: 600; }
.jm-line .p { width: 70px; text-align: right; font-weight: 700; }
.jm-sheet textarea { width: 100%; margin-top: 14px; border: 1px solid var(--jno-line); border-radius: 12px; padding: 10px 12px; min-height: 64px; resize: vertical; }
.jm-total { display: flex; justify-content: space-between; font-size: 19px; font-weight: 800; margin: 14px 2px; }
.jm-send { width: 100%; background: var(--jno-olive-dark); color: #fff; font-weight: 800; font-size: 18px; padding: 16px; border-radius: 14px; }
.jm-send:disabled { background: #C9C4A0; }

/* =================== ΚΟΥΖΙΝΑ & ΠΑΣΟ =================== */
.jk-top { position: sticky; top: 0; z-index: 10; background: #1C1315; border-bottom: 1px solid var(--jno-night-3); padding: 10px 14px; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.jk-top h1 { margin: 0 8px 0 0; font-size: 20px; }
.jk-st { display: flex; gap: 6px; flex-wrap: wrap; flex: 1; }
.jk-st button { background: var(--jno-night-3); color: #E2D6D9; padding: 10px 16px; border-radius: 10px; font-weight: 700; font-size: 15px; }
.jk-st button.on { background: var(--jno-plum); color: #fff; }
.jk-st button .c { background: rgba(255,255,255,.18); border-radius: 999px; padding: 1px 8px; margin-left: 6px; font-size: 13px; }
.jk-tools { display: flex; gap: 8px; align-items: center; font-size: 14px; color: #BFAFB3; }
.jk-tools button, .jk-tools a { background: var(--jno-night-3); color: #E2D6D9; padding: 9px 12px; border-radius: 10px; text-decoration: none; font-size: 14px; }
.jk-tools .sound.on { background: var(--jno-olive); color: #1C1315; }
.jk-off { background: var(--jno-plum) !important; color: #fff !important; }

.jk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; padding: 14px; align-items: start; }
.jk-card { background: var(--jno-night-2); border-radius: 16px; overflow: hidden; border: 2px solid var(--jno-night-3); animation: jk-in .3s ease-out; }
@keyframes jk-in { from { transform: scale(.96); opacity: 0; } }
.jk-card.warn { border-color: var(--jno-butter); }
.jk-card.late { border-color: var(--jno-rose); box-shadow: 0 0 0 2px var(--jno-plum); }
.jk-ch { display: flex; align-items: baseline; gap: 10px; padding: 12px 14px; background: var(--jno-night-3); }
.jk-ch .no { font-size: 28px; font-weight: 900; }
.jk-ch .tb { font-size: 17px; font-weight: 700; color: var(--jno-butter); }
.jk-ch .tm { margin-left: auto; font-size: 15px; font-weight: 700; color: #BFAFB3; font-variant-numeric: tabular-nums; }
.jk-card.warn .tm { color: var(--jno-butter); } .jk-card.late .tm { color: #E7B9C6; }
.jk-note { margin: 10px 14px 0; background: #403A1E; color: var(--jno-butter); border-radius: 8px; padding: 8px 10px; font-size: 15px; }
.jk-sec { padding: 10px 14px 14px; border-top: 1px dashed #4A373B; }
.jk-sec:first-of-type { border-top: 0; }
.jk-sec.other { opacity: .55; }
.jk-sec.other .jk-items { font-size: 15px; }
.jk-sh { display: flex; justify-content: space-between; align-items: center; font-size: 13px; text-transform: uppercase; letter-spacing: .5px; color: #BFAFB3; margin-bottom: 6px; }
.jk-state { text-transform: none; letter-spacing: 0; font-weight: 700; border-radius: 999px; padding: 2px 10px; font-size: 13px; }
.jk-state.new { background: #4A373B; color: #E2D6D9; }
.jk-state.taken { background: #2B3D55; color: #B9D0EC; }
.jk-state.done { background: #3E3B1F; color: var(--jno-butter); }
.jk-items { list-style: none; margin: 0 0 10px; padding: 0; font-size: 19px; font-weight: 600; }
.jk-items li { padding: 3px 0; }
.jk-items b { display: inline-block; min-width: 38px; color: var(--jno-butter); }
.jk-btn { width: 100%; padding: 18px; border-radius: 12px; font-size: 20px; font-weight: 900; letter-spacing: .5px; color: #1C1315; touch-action: manipulation; }
.jk-btn.take { background: var(--jno-blue); }
.jk-btn.done { background: var(--jno-olive); }
.jk-btn:active { transform: scale(.98); }
.jk-btn:disabled { opacity: .5; }
.jk-undo { background: transparent !important; color: #BFAFB3; font-size: 14px; margin-top: 6px; padding: 6px; width: 100%; }
.jk-cancel { background: transparent; color: var(--jno-rose); font-size: 13px; padding: 8px 14px 12px; }
.jk-empty { text-align: center; padding: 80px 20px; color: #9C8A8E; font-size: 20px; }

/* Πάσο */
.jp-sec-title { padding: 14px 14px 0; margin: 0; font-size: 15px; text-transform: uppercase; letter-spacing: .6px; color: #BFAFB3; }
.jp-card { background: #34311B; border: 2px solid var(--jno-olive); }
.jp-card .jk-ch { background: #4A4527; }
.jp-big { font-size: 46px !important; }
.jp-prep { display: flex; gap: 8px; flex-wrap: wrap; padding: 10px 14px 30px; }
.jp-prep span { background: var(--jno-night-3); border-radius: 10px; padding: 8px 12px; font-weight: 700; color: #E2D6D9; }
.jp-prep span small { color: #BFAFB3; font-weight: 400; }

/* =================== ONLINE: Delivery / Παραλαβή =================== */
.jm-q { font-weight: 800; font-size: 16px; margin: 4px 2px 10px; }
.jm-types { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.jm-type { background: #fff; border: 2px solid var(--jno-line) !important; border-radius: 14px; padding: 14px 10px; text-align: center; color: var(--jno-ink); display: flex; flex-direction: column; align-items: center; gap: 4px; }
.jm-type .ic { font-size: 30px; line-height: 1; }
.jm-type b { font-size: 16px; }
.jm-type small { font-size: 12px; color: var(--jno-moss); }
.jm-type.on { border-color: var(--jno-plum) !important; background: var(--jno-plum-soft); box-shadow: 0 0 0 1px var(--jno-plum); }
.jm-form { margin-top: 14px; }
.jm-f { display: block; margin-bottom: 10px; }
.jm-f span { display: block; font-size: 13px; font-weight: 700; color: var(--jno-moss); margin: 0 2px 4px; }
.jm-f input, .jm-f select { width: 100%; font-size: 16px; padding: 12px; border: 1px solid var(--jno-line); border-radius: 12px; background: #fff; color: var(--jno-ink); -webkit-appearance: none; appearance: none; }
.jm-f input:focus, .jm-f select:focus, .jm-sheet textarea:focus { outline: 2px solid var(--jno-plum); outline-offset: 0; border-color: transparent; }
.jm-hint { font-size: 13px; color: var(--jno-moss); background: var(--jno-butter-soft); border-radius: 10px; padding: 8px 10px; margin: -2px 0 10px; }
.jm-pay { display: flex; gap: 8px; }
.jm-pay button { flex: 1; padding: 12px; border-radius: 12px; background: #fff; border: 2px solid var(--jno-line) !important; font-weight: 700; color: var(--jno-ink); }
.jm-pay button.on { border-color: var(--jno-plum) !important; background: var(--jno-plum-soft); }
.jm-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.jm-sum { margin-top: 14px; border-top: 1px solid var(--jno-line); padding-top: 10px; font-size: 15px; color: var(--jno-moss); }
.jm-sum div { display: flex; justify-content: space-between; padding: 2px 2px; }
.jk-ch .tb.on { color: var(--jno-blue); }
.jk-cust { padding: 10px 14px 0; font-size: 15px; line-height: 1.45; color: #E2D6D9; }
.jk-cust b { color: #fff; }
.jk-cust a { color: var(--jno-blue); }
.jk-pay { display: inline-block; margin-top: 4px; background: var(--jno-night-3); border-radius: 8px; padding: 2px 8px; font-size: 13px; color: var(--jno-butter); }
.jk-online { padding: 9px 12px; border-radius: 10px; font-weight: 700; font-size: 14px; }
.jk-online.open { background: var(--jno-olive) !important; color: #1C1315 !important; }
.jk-online.closed { background: var(--jno-plum) !important; color: #fff !important; }

/* =================== ΕΚΠΤΩΣΕΙΣ =================== */
.jm-prod .price.sale { color: var(--jno-plum); }
.jm-old { color: #C62828; text-decoration: line-through; text-decoration-thickness: 2px; font-size: 14px; font-weight: 600; margin-left: -2px; }
.jm-badge.sale { background: #C62828; color: #fff; }
.jm-prod.out .jm-old, .jm-prod.out .jm-badge.sale { color: #888; background: transparent; }
.jm-chip.sale { background: #FDECEC; color: #C62828; }
.jm-chip.sale.on { background: #C62828; color: #fff; }
.jm-sale-hero { background: #FDECEC; color: #8E1F1F; border-left-color: #C62828; }
.jm-save { display: flex; justify-content: space-between; color: #C62828; font-weight: 700; font-size: 15px; margin: 12px 2px -6px; }
.jm-line .p del.jm-old { font-size: 12px; }

/* =================== BUNDLES / COMBO =================== */
.jm-badge.combo { background: var(--jno-butter); color: var(--jno-aubergine); vertical-align: 2px; }
.jm-incl { font-size: 13px; color: var(--jno-rust); font-weight: 600; margin-top: 2px; }
.jm-chip.combo { background: var(--jno-butter-soft); color: var(--jno-aubergine); }
.jm-chip.combo.on { background: var(--jno-aubergine); color: #fff; }
.jm-combo-hero { background: var(--jno-butter); border-left-color: var(--jno-aubergine); }
.jm-pick { background: var(--jno-plum); color: #fff; padding: 10px 14px; border-radius: 12px; font-weight: 700; font-size: 15px; flex: 0 0 auto; white-space: nowrap; }
.jm-pick:disabled { background: #D9CFD2; }
.jm-pick .cnt { background: var(--jno-butter); color: var(--jno-aubergine); border-radius: 999px; padding: 0 7px; margin-left: 4px; font-size: 13px; }
.jm-picker-wrap .jm-sheet-bg { z-index: 40; }
.jm-picker { z-index: 41; }
.jm-pick-price { display: flex; gap: 8px; align-items: center; margin: -4px 0 6px; font-size: 18px; font-weight: 800; }
.jm-pick-price .jm-old { font-size: 15px; }
.jm-slot { margin: 14px 0; }
.jm-slot .jm-q small { font-weight: 400; color: var(--jno-moss); }
.jm-opts { display: flex; flex-direction: column; gap: 8px; }
.jm-opt { text-align: left; background: #fff; border: 2px solid var(--jno-line) !important; border-radius: 12px; padding: 12px 14px; font-weight: 600; color: var(--jno-ink); font-size: 15px; }
.jm-opt.on { border-color: var(--jno-plum) !important; background: var(--jno-plum-soft); }
.jm-opt.on::before { content: '✓ '; color: var(--jno-plum); }
.jm-opt:disabled { opacity: .45; text-decoration: line-through; }
.jm-optfix { background: var(--jno-butter-soft); border-radius: 12px; padding: 12px 14px; font-weight: 600; color: var(--jno-moss); }
.jm-line .jm-incl { font-weight: 500; font-size: 12px; }
.jk-from { color: var(--jno-butter); font-size: 13px; font-weight: 600; opacity: .85; }
.jk-comp { font-size: 14px; font-weight: 500; color: #CDBFC3; margin: 2px 0 0 38px; }
.jm-opt { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.jm-optv { color: var(--jno-moss); font-weight: 500; font-size: 12px; white-space: nowrap; }

/* Μηνύματα όταν κάτι δεν φορτώνει */
.jno-loading.jno-fail { max-width: 560px; margin: 30px auto; background: #fff; color: #3E2629; border-left: 5px solid #C62828; border-radius: 12px; padding: 18px 20px; text-align: center; opacity: 1; line-height: 1.5; }
.jno-loading.jno-fail a { color: #923568; }
.jno-loading.jno-fail code { background: #f3eee8; padding: 1px 5px; border-radius: 4px; font-size: 12px; }

/* Emoji του WordPress (<img class="emoji">): πάντα στο μέγεθος του κειμένου,
   ακόμα κι αν λείπουν τα CSS του θέματος/WordPress. */
.jno-root img.emoji, body.jno-app img.emoji, img.wp-smiley {
	display: inline !important; border: none !important; box-shadow: none !important;
	height: 1em !important; width: 1em !important; max-width: 1em !important;
	margin: 0 .07em !important; padding: 0 !important; vertical-align: -0.1em !important; background: none !important;
}
.jno-root img { max-width: 100%; }

/* =================== ΕΠΙΛΟΓΕΣ (ζάχαρη, extra) =================== */
.jm-pick.plus { width: 42px; height: 42px; padding: 0; font-size: 24px; line-height: 1; display: flex; align-items: center; justify-content: center; gap: 2px; }
.jm-pick.plus .cnt { font-size: 11px; padding: 0 5px; margin-left: 0; position: relative; top: -10px; }
.jm-pdesc { color: var(--jno-moss); font-size: 14px; margin: -2px 0 8px; }
.jm-grp { margin: 14px 0; }
.jm-grp .jm-q small { font-weight: 500; color: var(--jno-moss); font-size: 13px; }
.jm-opts.row { flex-direction: row; flex-wrap: wrap; }
.jm-opts.row .jm-opt { flex: 1 1 0; justify-content: center; text-align: center; min-width: 90px; }
.jm-opt.chk::before { content: '☐ '; color: var(--jno-moss); }
.jm-opt.chk.on::before { content: '☑ '; color: var(--jno-plum); }
.jm-sub-grps { margin: 8px 0 0 10px; padding-left: 12px; border-left: 3px solid var(--jno-butter); }
.jm-sub-grps .jm-grp { margin: 10px 0; }
.jk-opts { font-size: 15px; font-weight: 700; color: var(--jno-blue); margin: 1px 0 0 38px; }
.jk-comp + .jk-opts, .jk-sec .jk-opts { }

/* =================== 🎡 ΤΡΟΧΟΣ ΤΗΣ ΤΥΧΗΣ =================== */
.jm-wheel-bg { z-index: 50 !important; background: rgba(20, 12, 14, .72) !important; }
.jm-wheel-modal { position: fixed; z-index: 51; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(92vw, 420px); max-height: 94vh; overflow-y: auto;
	background: #fff; border-radius: 22px; padding: 18px 18px 16px; text-align: center; box-shadow: 0 20px 60px rgba(0,0,0,.35); animation: jm-pop .35s ease-out; }
@keyframes jm-pop { from { transform: translate(-50%, -46%) scale(.92); opacity: 0; } }
.jm-wheel-modal h2 { margin: 2px 0 4px; font-size: 22px; color: var(--jno-ink); }
.jm-wheel-sub { margin: 8px 4px 12px; color: var(--jno-moss); font-size: 15px; }
.jm-wheel-box { position: relative; width: min(78vw, 320px); margin: 10px auto 4px; }
.jm-wheel-svg { width: 100%; height: auto; display: block; filter: drop-shadow(0 6px 14px rgba(0,0,0,.25)); }
.jm-wheel-rot { transform-origin: 0 0; transform-box: view-box; }
.jm-pointer { position: absolute; left: 50%; top: -6px; transform: translateX(-50%); width: 0; height: 0; z-index: 2;
	border-left: 16px solid transparent; border-right: 16px solid transparent; border-top: 28px solid var(--jno-ink); filter: drop-shadow(0 2px 2px rgba(0,0,0,.3)); }
.jm-spin-btn { background: var(--jno-plum) !important; font-size: 19px !important; }
.jm-wheel-skip { background: transparent !important; color: var(--jno-moss); margin-top: 8px; font-size: 14px; text-decoration: underline; padding: 6px; }
.jm-wheel-res { font-size: 22px; font-weight: 800; margin-top: 10px; }
.jm-wheel-res.win { color: #1E7A3E; }
.jm-wheel-res.lose { color: var(--jno-aubergine); }
.jm-wheel-hint { margin: 8px 2px 10px; padding: 8px 10px; background: var(--jno-butter-soft); border-radius: 10px; font-weight: 700; color: var(--jno-aubergine); font-size: 14px; text-align: center; }
.jm-prize { display: flex; justify-content: space-between; color: #1E7A3E; font-weight: 800; font-size: 15px; margin: 10px 2px -4px; }
.jm-confetti { position: fixed; inset: 0; z-index: 52; pointer-events: none; overflow: hidden; }
.jm-confetti span { position: absolute; top: -40px; animation: jm-fall 2.6s ease-in forwards; }
@keyframes jm-fall { to { transform: translateY(110vh) rotate(540deg); opacity: .9; } }
.jk-promo { margin: 8px 14px 0; background: #1F3D2A; color: #9FE2B4; border-radius: 8px; padding: 6px 10px; font-size: 14px; font-weight: 700; }