{"id":55,"date":"2026-10-22T23:58:22","date_gmt":"2026-10-22T23:58:22","guid":{"rendered":"https:\/\/apk.produsenpagarbrc.com\/?p=55"},"modified":"2026-10-22T23:58:22","modified_gmt":"2026-10-22T23:58:22","slug":"honeybound-links","status":"publish","type":"post","link":"https:\/\/play.produsenpagarbrc.com\/?p=55","title":{"rendered":"Honeybound Links"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\"><strong>Honeybound Links<\/strong> is a cozy pair-matching puzzle game set inside a warm honeylit library, where every tile feels like a tiny treasure from a quiet reading room. Golden bookmarks, old books, honey jars, lamps, teacups, reading glasses, scrolls, keys, and soft amber details are waiting to be connected before time runs out.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Your goal is simple: find two matching tiles and connect them with a clear path. If the path can travel between the tiles with no more than two turns, the pair disappears in a soft glow of honeylight. Clear every tile on the board, protect your time, and move deeper into the golden shelves.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/play.produsenpagarbrc.com\/wp-content\/uploads\/2026\/10\/Honeybound-Links-1024x768.png\" alt=\"\" class=\"wp-image-56\"\/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">A Cozy Library Puzzle With Gentle Challenge<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Honeybound Links<\/strong> brings the classic link-matching puzzle experience into a softer and more magical world. Instead of a loud board full of random objects, this game invites you into a peaceful library filled with warm cream colors, amber light, wooden shelves, floating dust, and little objects that feel like they belong in a storybook.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Each level gives you a new board to clear. As you progress, the puzzle becomes wider, fuller, and more challenging. More tile types appear, the time becomes more precious, and every match asks you to look carefully before tapping. It is easy to understand, but the deeper levels reward patience, memory, and calm focus.<\/p>\n\n\n\n<style>\n  #honeyLibraryMatch27,\n  #honeyLibraryMatch27 * {\n    box-sizing: border-box;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  #honeyLibraryMatch27 {\n    \/* Manual fullscreen tuning knobs:\n       - smaller board-ratio = taller board frame\n       - larger board-ratio = shorter board frame\n       - smaller grid-scale = tighter\/smaller tile group\n       - larger tile-fill = larger tiles with smaller gaps *\/\n    --ebm-fullscreen-board-inset: clamp(18px, 2.2vw, 44px);\n    --ebm-fullscreen-board-ratio: 2.10 \/ 1;\n    --ebm-fullscreen-board-max-height-gap: clamp(42px, 5.8vh, 86px);\n    --ebm-fullscreen-grid-scale: .94;\n    --ebm-tile-fill: .985;\n    width: 100%;\n    max-width: 1100px;\n    margin: 18px auto;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    font-family: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\n    color: #24454b;\n  }\n\n  #honeyLibraryMatch27 .opm-frame {\n    position: relative;\n    width: min(100%, 1080px, calc(92vh * 16 \/ 9));\n    aspect-ratio: 16 \/ 9;\n    overflow: hidden;\n    border-radius: 26px;\n    display: grid;\n    grid-template-rows: auto minmax(0, 1fr) auto;\n    padding: clamp(6px, 1.1vmin, 13px);\n    isolation: isolate;\n    min-height: 0;\n    background:\n      radial-gradient(circle at 18% 14%, rgba(216, 183, 106, .36), transparent 24%),\n      radial-gradient(circle at 82% 18%, rgba(170, 166, 216, .24), transparent 28%),\n      radial-gradient(circle at 18% 88%, rgba(125, 185, 179, .34), transparent 30%),\n      radial-gradient(circle at 86% 86%, rgba(216, 141, 122, .22), transparent 28%),\n      linear-gradient(155deg, #173f49 0%, #1f5f67 42%, #365f6b 70%, #7db9b3 100%);\n    border: 1px solid rgba(242, 238, 228, .34);\n    box-shadow:\n      0 20px 48px rgba(20, 58, 66, .28),\n      inset 0 0 0 1px rgba(255, 255, 255, .12);\n  }\n\n  #honeyLibraryMatch27 .opm-frame::before {\n    content: \"\";\n    position: absolute;\n    inset: 0;\n    z-index: -3;\n    pointer-events: none;\n    background:\n      linear-gradient(to bottom, rgba(242, 238, 228, .24), rgba(242, 238, 228, 0) 34%),\n      radial-gradient(ellipse at 50% -16%, rgba(242, 238, 228, .34), transparent 45%),\n      repeating-linear-gradient(105deg, rgba(255,255,255,.045) 0 1px, transparent 1px 30px);\n    opacity: .82;\n  }\n\n  #honeyLibraryMatch27 .opm-frame::after {\n    content: \"\";\n    position: absolute;\n    left: -4%;\n    right: -4%;\n    bottom: -3%;\n    height: 30%;\n    z-index: -2;\n    pointer-events: none;\n    opacity: .9;\n    background:\n      radial-gradient(ellipse at 18% 95%, rgba(45, 96, 87, .72), transparent 31%),\n      radial-gradient(ellipse at 38% 100%, rgba(216, 141, 122, .28), transparent 25%),\n      radial-gradient(ellipse at 62% 100%, rgba(125, 185, 179, .38), transparent 30%),\n      radial-gradient(ellipse at 82% 96%, rgba(216, 183, 106, .24), transparent 25%);\n  }\n\n  #honeyLibraryMatch27 .opm-bubbles {\n    position: absolute;\n    inset: 0;\n    z-index: -1;\n    pointer-events: none;\n    opacity: .88;\n    background:\n      radial-gradient(circle at 12% 26%, rgba(242, 238, 228, .38) 0 2px, transparent 3px),\n      radial-gradient(circle at 28% 58%, rgba(242, 238, 228, .24) 0 2px, transparent 3px),\n      radial-gradient(circle at 78% 34%, rgba(242, 238, 228, .32) 0 2px, transparent 3px),\n      radial-gradient(circle at 88% 68%, rgba(242, 238, 228, .26) 0 3px, transparent 4px),\n      radial-gradient(circle at 52% 20%, rgba(216, 183, 106, .26) 0 2px, transparent 3px);\n  }\n\n  #honeyLibraryMatch27 .opm-topbar {\n    position: relative;\n    z-index: 5;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    gap: clamp(3px, .58vmin, 7px);\n    flex-wrap: wrap;\n    padding: 0 50px 5px;\n  }\n\n  #honeyLibraryMatch27 .opm-chip {\n    min-width: 48px;\n    padding: 4px 7px;\n    border-radius: 999px;\n    text-align: center;\n    line-height: 1.02;\n    background: rgba(242, 238, 228, .78);\n    border: 1px solid rgba(220, 248, 244, .36);\n    box-shadow:\n      0 6px 16px rgba(14, 48, 56, .12),\n      inset 0 0 0 1px rgba(255, 255, 255, .22);\n    backdrop-filter: blur(10px);\n  }\n\n  #honeyLibraryMatch27 .opm-chip span {\n    display: block;\n    font-size: clamp(7px, .75vmin, 9px);\n    letter-spacing: .09em;\n    text-transform: uppercase;\n    opacity: .72;\n    font-weight: 900;\n    color: #4b656b;\n  }\n\n  #honeyLibraryMatch27 .opm-chip b {\n    display: block;\n    margin-top: 1px;\n    font-size: clamp(10px, 1.28vmin, 15px);\n    color: #24454b;\n    font-weight: 950;\n  }\n\n  #honeyLibraryMatch27 .opm-timeChip b,\n  #honeyLibraryMatch27 .opm-comboChip b {\n    color: #1f5f67;\n  }\n\n  #honeyLibraryMatch27 .opm-timerline {\n    position: absolute;\n    left: clamp(10px, 1.4vmin, 20px);\n    right: clamp(10px, 1.4vmin, 20px);\n    top: clamp(55px, 5.8vmin, 60px);\n    height: 5px;\n    border-radius: 999px;\n    overflow: hidden;\n    z-index: 4;\n    background: rgba(242, 238, 228, .24);\n    box-shadow:\n      inset 0 0 0 1px rgba(232, 255, 252, .18),\n      0 4px 12px rgba(15, 56, 64, .12);\n  }\n\n  #honeyLibraryMatch27 .opm-timerfill {\n    width: 100%;\n    height: 100%;\n    border-radius: inherit;\n    background: linear-gradient(90deg, #7db9b3, #d8b76a, #d88d7a);\n    transition: width .25s linear;\n    box-shadow: 0 0 14px rgba(216, 183, 106, .36);\n  }\n\n  #honeyLibraryMatch27 .opm-boardShell {\n    position: relative;\n    min-height: 0;\n    overflow: hidden;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding-top: clamp(4px, .72vmin, 9px);\n    padding-bottom: clamp(4px, .72vmin, 9px);\n  }\n\n  #honeyLibraryMatch27 .opm-boardShell::before {\n    content: \"\";\n    position: absolute;\n    width: min(96%, 980px);\n    height: min(92%, 520px);\n    border-radius: 28px;\n    background: rgba(209, 241, 237, .12);\n    border: 1px solid rgba(242, 238, 228, .2);\n    box-shadow:\n      0 14px 38px rgba(14, 48, 56, .12),\n      inset 0 0 30px rgba(242, 238, 228, .08);\n    pointer-events: none;\n  }\n\n  #honeyLibraryMatch27 .opm-boardPad {\n    position: relative;\n    flex: 0 0 auto;\n  }\n\n  #honeyLibraryMatch27 .opm-lines {\n    position: absolute;\n    inset: 0;\n    overflow: visible;\n    pointer-events: none;\n    z-index: 4;\n  }\n\n  #honeyLibraryMatch27 .opm-lines polyline {\n    fill: none;\n    stroke: rgba(242, 238, 228, .98);\n    stroke-width: 6;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n    filter:\n      drop-shadow(0 0 7px rgba(216, 183, 106, .62))\n      drop-shadow(0 3px 5px rgba(14, 48, 56, .24));\n  }\n\n  #honeyLibraryMatch27 .opm-lines polyline.opm-hintline {\n    stroke: rgba(168, 213, 208, .98);\n    stroke-dasharray: 10 8;\n    filter:\n      drop-shadow(0 0 7px rgba(168, 213, 208, .55))\n      drop-shadow(0 2px 4px rgba(14, 48, 56, .2));\n  }\n\n  #honeyLibraryMatch27 .opm-board {\n    position: absolute;\n    inset: 0;\n    z-index: 3;\n  }\n\n  #honeyLibraryMatch27 .opm-tile {\n    position: absolute;\n    border: 0;\n    border-radius: clamp(9px, 1vmin, 15px);\n    background: transparent;\n    box-shadow: none;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    cursor: pointer;\n    transform: translateZ(0);\n    transition: transform .13s ease, opacity .18s ease, filter .15s ease;\n    user-select: none;\n    overflow: visible;\n    touch-action: manipulation;\n  }\n\n  #honeyLibraryMatch27 .opm-tile::before {\n    content: \"\";\n    position: absolute;\n    inset: clamp(1px, .22vmin, 3px);\n    border-radius: clamp(9px, 1vmin, 15px);\n    z-index: 0;\n    background:\n      radial-gradient(circle at 32% 24%, rgba(255, 255, 255, .7), transparent 24%),\n      linear-gradient(145deg, rgba(242, 238, 228, .96), rgba(168, 213, 208, .86));\n    box-shadow:\n      0 6px 14px rgba(10, 41, 49, .18),\n      inset 0 0 0 1px rgba(255, 255, 255, .62),\n      inset 0 -8px 18px rgba(31, 95, 103, .08);\n    transition: background .13s ease, box-shadow .13s ease, inset .13s ease;\n  }\n\n  #honeyLibraryMatch27 .opm-tile svg {\n    width: 95%;\n    height: 95%;\n    display: block;\n    pointer-events: none;\n    position: relative;\n    z-index: 1;\n    filter:\n      drop-shadow(0 1px 1px rgba(13, 48, 55, .16))\n      drop-shadow(0 3px 5px rgba(13, 48, 55, .07));\n  }\n\n  #honeyLibraryMatch27 .opm-tile:hover {\n    transform: translateY(-2px) scale(1.025);\n  }\n\n  #honeyLibraryMatch27 .opm-tile.opm-selected {\n    transform: scale(.965);\n  }\n\n  #honeyLibraryMatch27 .opm-tile.opm-selected::before {\n    background:\n      radial-gradient(circle at 32% 24%, rgba(255, 255, 255, .75), transparent 24%),\n      linear-gradient(145deg, rgba(242, 238, 228, .98), rgba(216, 183, 106, .82));\n    box-shadow:\n      0 0 0 3px rgba(216, 183, 106, .72),\n      0 0 18px rgba(216, 183, 106, .38),\n      0 9px 20px rgba(10, 41, 49, .2);\n  }\n\n  #honeyLibraryMatch27 .opm-tile.opm-match {\n    animation: opmPearlBloom .24s ease forwards;\n  }\n\n  #honeyLibraryMatch27 .opm-tile.opm-hint {\n    animation: opmHintPulse .7s ease infinite alternate;\n  }\n\n  #honeyLibraryMatch27 .opm-tile.opm-wrong {\n    animation: opmShake .26s ease;\n  }\n\n  #honeyLibraryMatch27 .opm-tile.opm-wrong::before {\n    box-shadow:\n      0 0 0 3px rgba(216, 141, 122, .72),\n      0 0 18px rgba(216, 141, 122, .32),\n      0 7px 16px rgba(10, 41, 49, .18);\n  }\n\n  #honeyLibraryMatch27 .opm-bottom {\n    position: relative;\n    z-index: 5;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    gap: clamp(7px, 1vmin, 12px);\n    padding-top: 2px;\n  }\n\n  #honeyLibraryMatch27 .opm-action {\n    min-width: 92px;\n    border: 0;\n    border-radius: 999px;\n    padding: clamp(8px, 1.05vmin, 11px) clamp(12px, 1.7vmin, 19px);\n    cursor: pointer;\n    color: #24454b;\n    font-weight: 950;\n    letter-spacing: .02em;\n    font-size: clamp(10px, 1.22vmin, 14px);\n    background:\n      radial-gradient(circle at 34% 18%, rgba(255, 255, 255, .72), transparent 28%),\n      linear-gradient(145deg, rgba(242, 238, 228, .92), rgba(168, 213, 208, .76));\n    border: 1px solid rgba(220, 248, 244, .4);\n    box-shadow:\n      0 8px 18px rgba(10, 41, 49, .16),\n      inset 0 0 0 1px rgba(255, 255, 255, .28);\n    backdrop-filter: blur(10px);\n  }\n\n  #honeyLibraryMatch27 .opm-action:active {\n    transform: translateY(1px) scale(.98);\n  }\n\n  #honeyLibraryMatch27 .opm-action:disabled {\n    opacity: .45;\n    cursor: not-allowed;\n  }\n\n  #honeyLibraryMatch27 .opm-shuffleBtn {\n    background:\n      radial-gradient(circle at 34% 18%, rgba(255, 255, 255, .68), transparent 28%),\n      linear-gradient(145deg, rgba(242, 238, 228, .92), rgba(216, 141, 122, .56));\n  }\n\n  #honeyLibraryMatch27 .opm-pauseBtn {\n    background:\n      radial-gradient(circle at 34% 18%, rgba(255, 255, 255, .68), transparent 28%),\n      linear-gradient(145deg, rgba(242, 238, 228, .92), rgba(216, 183, 106, .55));\n  }\n\n  #honeyLibraryMatch27 .opm-floatBtn {\n    position: absolute;\n    top: clamp(7px, 1.2vmin, 13px);\n    width: clamp(34px, 4.4vmin, 46px);\n    height: clamp(34px, 4.4vmin, 46px);\n    border-radius: 999px;\n    border: 1px solid rgba(220, 248, 244, .34);\n    background: rgba(242, 238, 228, .18);\n    box-shadow:\n      0 7px 18px rgba(9, 38, 45, .14),\n      inset 0 0 0 1px rgba(255, 255, 255, .12);\n    cursor: pointer;\n    z-index: 20;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    backdrop-filter: blur(10px);\n  }\n\n  #honeyLibraryMatch27 .opm-soundBtn {\n    left: clamp(7px, 1.2vmin, 13px);\n  }\n\n  #honeyLibraryMatch27 .opm-fullBtn {\n    right: clamp(7px, 1.2vmin, 13px);\n    z-index: 45;\n  }\n\n  #honeyLibraryMatch27 .opm-soundIcon {\n    position: relative;\n    width: 22px;\n    height: 22px;\n    display: block;\n    transform: translateX(-1px);\n    filter: drop-shadow(0 0 5px rgba(168, 213, 208, .42));\n  }\n\n  #honeyLibraryMatch27 .opm-spk-back {\n    position: absolute;\n    left: 0;\n    top: 7px;\n    width: 5px;\n    height: 9px;\n    background: #eafdfb;\n    border-radius: 3px 0 0 3px;\n  }\n\n  #honeyLibraryMatch27 .opm-spk-cone {\n    position: absolute;\n    left: 4px;\n    top: 3px;\n    width: 10px;\n    height: 17px;\n    background: #eafdfb;\n    clip-path: polygon(0 36%, 100% 0, 100% 100%, 0 64%);\n    border-radius: 2px;\n  }\n\n  #honeyLibraryMatch27 .opm-spk-wave {\n    position: absolute;\n    border-style: solid;\n    border-color: #eafdfb;\n    border-left-color: transparent;\n    border-top-color: transparent;\n    border-bottom-color: transparent;\n    border-radius: 0 999px 999px 0;\n    opacity: 1;\n    transition: opacity .16s ease;\n  }\n\n  #honeyLibraryMatch27 .opm-spk-wave1 {\n    right: 5px;\n    top: 8px;\n    width: 4px;\n    height: 7px;\n    border-width: 2px;\n  }\n\n  #honeyLibraryMatch27 .opm-spk-wave2 {\n    right: 1px;\n    top: 6px;\n    width: 8px;\n    height: 11px;\n    border-width: 2px;\n  }\n\n  #honeyLibraryMatch27 .opm-spk-wave3 {\n    right: -3px;\n    top: 3px;\n    width: 12px;\n    height: 17px;\n    border-width: 2px;\n  }\n\n  #honeyLibraryMatch27 .opm-spk-slash {\n    position: absolute;\n    left: 0px;\n    top: 10px;\n    width: 24px;\n    height: 3px;\n    border-radius: 999px;\n    background: #f2eee4;\n    transform: rotate(-42deg) scaleX(0);\n    transform-origin: center;\n    box-shadow:\n      0 0 0 1px rgba(31, 95, 103, .22),\n      0 0 8px rgba(216, 141, 122, .46);\n    transition: transform .16s ease;\n  }\n\n  #honeyLibraryMatch27.opm-soundOff .opm-spk-wave1,\n  #honeyLibraryMatch27.opm-soundOff .opm-spk-wave2,\n  #honeyLibraryMatch27.opm-soundOff .opm-spk-wave3 {\n    opacity: 0;\n  }\n\n  #honeyLibraryMatch27.opm-soundOff .opm-spk-slash {\n    transform: rotate(-42deg) scaleX(1);\n  }\n\n  #honeyLibraryMatch27 .opm-fullIcon {\n    position: relative;\n    width: 23px;\n    height: 23px;\n    display: block;\n    background:\n      linear-gradient(#eafdfb, #eafdfb) left top \/ 10px 3px no-repeat,\n      linear-gradient(#eafdfb, #eafdfb) left top \/ 3px 10px no-repeat,\n      linear-gradient(#eafdfb, #eafdfb) right top \/ 10px 3px no-repeat,\n      linear-gradient(#eafdfb, #eafdfb) right top \/ 3px 10px no-repeat,\n      linear-gradient(#eafdfb, #eafdfb) left bottom \/ 10px 3px no-repeat,\n      linear-gradient(#eafdfb, #eafdfb) left bottom \/ 3px 10px no-repeat,\n      linear-gradient(#eafdfb, #eafdfb) right bottom \/ 10px 3px no-repeat,\n      linear-gradient(#eafdfb, #eafdfb) right bottom \/ 3px 10px no-repeat;\n    filter: drop-shadow(0 0 5px rgba(168, 213, 208, .4));\n  }\n\n  #honeyLibraryMatch27 .opm-toast {\n    position: absolute;\n    left: 50%;\n    bottom: clamp(52px, 7.2vmin, 72px);\n    transform: translateX(-50%) translateY(12px);\n    max-width: 84%;\n    padding: 8px 15px;\n    border-radius: 999px;\n    background: rgba(242, 238, 228, .92);\n    color: #24454b;\n    font-weight: 850;\n    font-size: clamp(11px, 1.25vmin, 14px);\n    box-shadow:\n      0 10px 24px rgba(10, 41, 49, .17),\n      inset 0 0 0 1px rgba(255, 255, 255, .28);\n    opacity: 0;\n    pointer-events: none;\n    transition: opacity .18s ease, transform .18s ease;\n    z-index: 25;\n    text-align: center;\n    backdrop-filter: blur(10px);\n  }\n\n  #honeyLibraryMatch27 .opm-toast.opm-show {\n    opacity: 1;\n    transform: translateX(-50%) translateY(0);\n  }\n\n  #honeyLibraryMatch27 .opm-overlay {\n    position: absolute;\n    inset: 0;\n    z-index: 30;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 18px;\n    background:\n      radial-gradient(circle at 50% 30%, rgba(242, 238, 228, .14), transparent 38%),\n      rgba(12, 47, 56, .44);\n    backdrop-filter: blur(9px);\n  }\n\n  #honeyLibraryMatch27 .opm-overlay.opm-hidden {\n    display: none;\n  }\n\n  #honeyLibraryMatch27 .opm-card {\n    width: min(86%, 470px);\n    border-radius: 26px;\n    padding: clamp(19px, 3.25vmin, 31px);\n    text-align: center;\n    background:\n      radial-gradient(circle at 28% 16%, rgba(255, 255, 255, .62), transparent 29%),\n      linear-gradient(145deg, rgba(242, 238, 228, .96), rgba(168, 213, 208, .9));\n    border: 1px solid rgba(255, 255, 255, .56);\n    box-shadow:\n      0 22px 55px rgba(8, 36, 43, .28),\n      inset 0 0 0 1px rgba(255, 255, 255, .22);\n  }\n\n  #honeyLibraryMatch27 .opm-titleMark {\n    width: 54px;\n    height: 54px;\n    margin: 0 auto 10px;\n    border-radius: 50%;\n    background:\n      radial-gradient(circle at 34% 28%, #ffffff 0 9px, #f2eee4 10px 18px, #d8b76a 19px 22px, rgba(125, 185, 179, .74) 23px 100%);\n    box-shadow:\n      0 0 20px rgba(216, 183, 106, .32),\n      0 10px 22px rgba(31, 95, 103, .14);\n  }\n\n  #honeyLibraryMatch27 .opm-message {\n    margin: 0 0 8px;\n    color: #24454b;\n    font-size: clamp(21px, 3vmin, 31px);\n    line-height: 1.12;\n    font-weight: 950;\n    letter-spacing: -.02em;\n  }\n\n  #honeyLibraryMatch27 .opm-small {\n    margin: 0 auto 18px;\n    max-width: 390px;\n    color: rgba(36, 69, 75, .78);\n    font-size: clamp(13px, 1.7vmin, 16px);\n    line-height: 1.45;\n    font-weight: 650;\n  }\n\n  #honeyLibraryMatch27 .opm-start {\n    border: 0;\n    border-radius: 999px;\n    min-width: 158px;\n    padding: 12px 24px;\n    background: linear-gradient(145deg, #1f5f67, #7db9b3);\n    color: #fffdf1;\n    font-weight: 950;\n    font-size: 15px;\n    cursor: pointer;\n    box-shadow: 0 11px 24px rgba(31, 95, 103, .3);\n  }\n\n  #honeyLibraryMatch27 .opm-start:active {\n    transform: translateY(1px) scale(.985);\n  }\n\n  #honeyLibraryMatch27:fullscreen {\n    width: 100vw;\n    height: 100vh;\n    max-width: none;\n    margin: 0;\n    background: #173f49;\n    overflow: hidden;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n\n  #honeyLibraryMatch27:fullscreen .opm-frame {\n    width: 100vw;\n    height: 100vh;\n    max-width: none;\n    max-height: none;\n    aspect-ratio: auto;\n    border-radius: 0;\n    padding-top: max(6px, env(safe-area-inset-top));\n    padding-right: max(6px, env(safe-area-inset-right));\n    padding-bottom: max(6px, env(safe-area-inset-bottom));\n    padding-left: max(6px, env(safe-area-inset-left));\n  }\n\n  #honeyLibraryMatch27.opm-ios-fullscreen {\n    position: fixed;\n    inset: 0;\n    z-index: 999999;\n    width: 100vw;\n    height: 100vh;\n    max-width: none;\n    margin: 0;\n    background: #173f49;\n    overflow: hidden;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n\n  #honeyLibraryMatch27.opm-ios-fullscreen .opm-frame {\n    width: 100vw;\n    height: 100vh;\n    max-width: none;\n    max-height: none;\n    aspect-ratio: auto;\n    border-radius: 0;\n    padding-top: max(6px, env(safe-area-inset-top));\n    padding-right: max(6px, env(safe-area-inset-right));\n    padding-bottom: max(6px, env(safe-area-inset-bottom));\n    padding-left: max(6px, env(safe-area-inset-left));\n  }\n\n  @supports (height: 100dvh) {\n    #honeyLibraryMatch27:fullscreen,\n    #honeyLibraryMatch27.opm-ios-fullscreen {\n      width: 100dvw;\n      height: 100dvh;\n    }\n\n    #honeyLibraryMatch27:fullscreen .opm-frame,\n    #honeyLibraryMatch27.opm-ios-fullscreen .opm-frame {\n      width: 100dvw;\n      height: 100dvh;\n    }\n  }\n\n  #honeyLibraryMatch27.opm-rotateFS .opm-frame {\n    position: absolute;\n    left: 50%;\n    top: 50%;\n    width: 100vh;\n    height: 100vw;\n    max-width: none;\n    max-height: none;\n    aspect-ratio: auto;\n    border-radius: 0;\n    transform: translate(-50%, -50%) rotate(90deg);\n    transform-origin: center center;\n  }\n\n  @supports (height: 100dvh) {\n    #honeyLibraryMatch27.opm-rotateFS .opm-frame {\n      width: 100dvh;\n      height: 100dvw;\n    }\n  }\n\n  @media (max-height: 520px) {\n    #honeyLibraryMatch27 .opm-frame {\n      padding: 5px;\n    }\n\n    #honeyLibraryMatch27 .opm-topbar {\n      gap: 3px;\n      padding-bottom: 2px;\n    }\n\n    #honeyLibraryMatch27 .opm-chip {\n      min-width: 40px;\n      padding: 3px 5px;\n    }\n\n    #honeyLibraryMatch27 .opm-chip span {\n      font-size: 7px;\n    }\n\n    #honeyLibraryMatch27 .opm-chip b {\n      font-size: 10px;\n    }\n\n    #honeyLibraryMatch27 .opm-timerline {\n      top: 39px;\n      height: 4px;\n    }\n\n    #honeyLibraryMatch27 .opm-boardShell {\n      padding-top: 1px;\n      padding-bottom: 1px;\n    }\n\n    #honeyLibraryMatch27 .opm-action {\n      min-width: 76px;\n      padding: 6px 10px;\n      font-size: 10px;\n    }\n\n    #honeyLibraryMatch27 .opm-bottom {\n      gap: 7px;\n    }\n\n    #honeyLibraryMatch27 .opm-floatBtn {\n      width: 32px;\n      height: 32px;\n    }\n\n    #honeyLibraryMatch27 .opm-soundIcon {\n      transform: scale(.86) translateX(-1px);\n    }\n\n    #honeyLibraryMatch27 .opm-fullIcon {\n      width: 19px;\n      height: 19px;\n    }\n  }\n\n  @keyframes opmPearlBloom {\n    0% { transform: scale(.96); opacity: 1; filter: brightness(1); }\n    60% { transform: scale(1.12); opacity: .86; filter: brightness(1.16); }\n    100% { transform: scale(1.2); opacity: 0; filter: brightness(1.28); }\n  }\n\n  @keyframes opmHintPulse {\n    0% { transform: scale(1); filter: brightness(1); }\n    100% { transform: scale(1.065); filter: brightness(1.12); }\n  }\n\n  @keyframes opmShake {\n    0%, 100% { transform: translateX(0); }\n    25% { transform: translateX(-4px); }\n    75% { transform: translateX(4px); }\n  }\n\n\n  \/* Honey Library Match redesign layer *\/\n  #honeyLibraryMatch27 {\n    color: #3b2a25;\n  }\n\n  #honeyLibraryMatch27 .opm-frame {\n    background:\n      radial-gradient(circle at 16% 10%, rgba(247, 221, 165, .34), transparent 23%),\n      radial-gradient(circle at 82% 16%, rgba(194, 104, 124, .22), transparent 28%),\n      radial-gradient(circle at 19% 88%, rgba(191, 121, 69, .24), transparent 30%),\n      radial-gradient(circle at 88% 88%, rgba(142, 91, 125, .22), transparent 28%),\n      linear-gradient(150deg, #2b1f2a 0%, #3a2946 36%, #5a3828 68%, #7a4b32 100%);\n    border-color: rgba(255, 224, 174, .42);\n    box-shadow:\n      0 22px 52px rgba(42, 25, 24, .34),\n      inset 0 0 0 1px rgba(255, 241, 214, .12);\n  }\n\n  #honeyLibraryMatch27 .opm-frame::before {\n    background:\n      linear-gradient(to bottom, rgba(255, 241, 214, .18), rgba(255, 241, 214, 0) 36%),\n      radial-gradient(ellipse at 50% -18%, rgba(247, 221, 165, .32), transparent 44%),\n      repeating-linear-gradient(100deg, rgba(255, 239, 210, .04) 0 1px, transparent 1px 32px),\n      linear-gradient(90deg, transparent 0 8%, rgba(255, 224, 174, .05) 8% 9%, transparent 9% 19%, rgba(255, 224, 174, .04) 19% 20%, transparent 20% 100%);\n    opacity: .92;\n  }\n\n  #honeyLibraryMatch27 .opm-frame::after {\n    background:\n      radial-gradient(ellipse at 16% 96%, rgba(93, 52, 39, .78), transparent 30%),\n      radial-gradient(ellipse at 36% 100%, rgba(194, 104, 124, .24), transparent 26%),\n      radial-gradient(ellipse at 58% 100%, rgba(215, 168, 86, .25), transparent 31%),\n      radial-gradient(ellipse at 84% 98%, rgba(143, 191, 138, .18), transparent 26%);\n  }\n\n  #honeyLibraryMatch27 .opm-bubbles {\n    opacity: .9;\n    background:\n      radial-gradient(circle at 12% 26%, rgba(246, 234, 210, .42) 0 2px, transparent 3px),\n      radial-gradient(circle at 28% 58%, rgba(215, 168, 86, .26) 0 2px, transparent 3px),\n      radial-gradient(circle at 78% 34%, rgba(246, 234, 210, .35) 0 2px, transparent 3px),\n      radial-gradient(circle at 88% 68%, rgba(201, 111, 125, .24) 0 3px, transparent 4px),\n      radial-gradient(circle at 52% 20%, rgba(255, 224, 174, .28) 0 2px, transparent 3px),\n      radial-gradient(circle at 43% 78%, rgba(255, 247, 226, .22) 0 1px, transparent 2px);\n  }\n\n  #honeyLibraryMatch27 .opm-topbar {\n    padding: 0 clamp(96px, 12vmin, 126px) clamp(14px, 1.9vmin, 20px);\n    gap: clamp(4px, .72vmin, 8px);\n  }\n\n  #honeyLibraryMatch27 .opm-chip {\n    background: rgba(255, 239, 210, .82);\n    border-color: rgba(255, 224, 174, .44);\n    box-shadow:\n      0 8px 18px rgba(59, 42, 37, .16),\n      inset 0 0 0 1px rgba(255, 255, 255, .24);\n  }\n\n  #honeyLibraryMatch27 .opm-chip span {\n    color: rgba(59, 42, 37, .72);\n  }\n\n  #honeyLibraryMatch27 .opm-chip b {\n    color: #3b2a25;\n  }\n\n  #honeyLibraryMatch27 .opm-timeChip b,\n  #honeyLibraryMatch27 .opm-comboChip b {\n    color: #9a5f35;\n  }\n\n  #honeyLibraryMatch27 .opm-timerline {\n    top: clamp(66px, 7.2vmin, 82px);\n    height: 6px;\n    background: rgba(255, 239, 210, .24);\n    box-shadow:\n      inset 0 0 0 1px rgba(255, 245, 224, .2),\n      0 5px 13px rgba(59, 42, 37, .14);\n  }\n\n  #honeyLibraryMatch27 .opm-timerfill {\n    background: linear-gradient(90deg, #8fbf8a, #d7a856, #c96f7d);\n    box-shadow: 0 0 15px rgba(215, 168, 86, .42);\n  }\n\n  #honeyLibraryMatch27 .opm-boardShell {\n    padding-top: clamp(15px, 2.5vmin, 31px);\n  }\n\n  #honeyLibraryMatch27 .opm-boardShell::before {\n    background: rgba(255, 239, 210, .105);\n    border-color: rgba(255, 224, 174, .24);\n    box-shadow:\n      0 16px 40px rgba(59, 42, 37, .16),\n      inset 0 0 34px rgba(255, 239, 210, .08);\n  }\n\n  #honeyLibraryMatch27 .opm-lines polyline {\n    stroke: rgba(255, 239, 210, .98);\n    stroke-width: 6.5;\n    filter:\n      drop-shadow(0 0 8px rgba(215, 168, 86, .68))\n      drop-shadow(0 4px 6px rgba(59, 42, 37, .28));\n  }\n\n  #honeyLibraryMatch27 .opm-lines polyline.opm-hintline {\n    stroke: rgba(255, 210, 135, .98);\n    stroke-dasharray: 11 8;\n    filter:\n      drop-shadow(0 0 8px rgba(215, 168, 86, .62))\n      drop-shadow(0 2px 4px rgba(59, 42, 37, .22));\n  }\n\n  #honeyLibraryMatch27 .opm-tile::before {\n    background:\n      radial-gradient(circle at 32% 22%, rgba(255, 255, 255, .74), transparent 24%),\n      linear-gradient(145deg, rgba(255, 244, 222, .98), rgba(233, 188, 137, .82));\n    box-shadow:\n      0 7px 15px rgba(48, 28, 22, .2),\n      inset 0 0 0 1px rgba(255, 255, 255, .66),\n      inset 0 -9px 18px rgba(122, 75, 50, .1);\n  }\n\n  #honeyLibraryMatch27 .opm-tile svg {\n    width: 92%;\n    height: 92%;\n    filter:\n      drop-shadow(0 1px 1px rgba(59, 42, 37, .18))\n      drop-shadow(0 3px 5px rgba(59, 42, 37, .09));\n  }\n\n  #honeyLibraryMatch27 .opm-tile.opm-selected::before {\n    background:\n      radial-gradient(circle at 32% 24%, rgba(255, 255, 255, .78), transparent 24%),\n      linear-gradient(145deg, rgba(255, 244, 222, .98), rgba(215, 168, 86, .86));\n    box-shadow:\n      0 0 0 3px rgba(215, 168, 86, .74),\n      0 0 20px rgba(215, 168, 86, .42),\n      0 10px 22px rgba(59, 42, 37, .22);\n  }\n\n  #honeyLibraryMatch27 .opm-tile.opm-match {\n    animation: opmThreadTileVanish .42s ease forwards;\n  }\n\n  #honeyLibraryMatch27 .opm-tile.opm-match svg {\n    animation: opmThreadIconFloat .42s ease forwards;\n  }\n\n  #honeyLibraryMatch27 .opm-tile .opm-threadFx {\n    position: absolute;\n    inset: -42%;\n    z-index: 3;\n    pointer-events: none;\n    border-radius: 50%;\n    background:\n      radial-gradient(circle at 50% 50%, rgba(255, 244, 222, .95) 0 5%, transparent 6%),\n      radial-gradient(circle at 30% 22%, rgba(215, 168, 86, .88) 0 4%, transparent 5%),\n      radial-gradient(circle at 74% 30%, rgba(201, 111, 125, .72) 0 3.5%, transparent 4.5%),\n      radial-gradient(circle at 18% 66%, rgba(255, 224, 174, .82) 0 3.5%, transparent 4.5%),\n      radial-gradient(circle at 78% 72%, rgba(143, 191, 138, .62) 0 3.5%, transparent 4.5%),\n      radial-gradient(circle at 51% 83%, rgba(255, 247, 226, .84) 0 3.5%, transparent 4.5%);\n    animation: opmThreadBloom .48s ease forwards;\n    filter: drop-shadow(0 0 8px rgba(215, 168, 86, .46));\n  }\n\n  #honeyLibraryMatch27 .opm-tile.opm-wrong::before {\n    box-shadow:\n      0 0 0 3px rgba(201, 111, 125, .74),\n      0 0 20px rgba(201, 111, 125, .36),\n      0 8px 17px rgba(59, 42, 37, .2);\n  }\n\n  #honeyLibraryMatch27 .opm-bottom {\n    gap: clamp(10px, 1.35vmin, 16px);\n  }\n\n  #honeyLibraryMatch27 .opm-action {\n    min-width: 118px;\n    color: #3b2a25;\n    background:\n      radial-gradient(circle at 34% 18%, rgba(255, 255, 255, .7), transparent 28%),\n      linear-gradient(145deg, rgba(255, 239, 210, .94), rgba(215, 168, 86, .66));\n    border-color: rgba(255, 224, 174, .48);\n    box-shadow:\n      0 9px 20px rgba(59, 42, 37, .18),\n      inset 0 0 0 1px rgba(255, 255, 255, .28);\n  }\n\n  #honeyLibraryMatch27 .opm-shuffleBtn {\n    background:\n      radial-gradient(circle at 34% 18%, rgba(255, 255, 255, .68), transparent 28%),\n      linear-gradient(145deg, rgba(255, 239, 210, .94), rgba(201, 111, 125, .6));\n  }\n\n  #honeyLibraryMatch27 .opm-floatBtn {\n    border-color: rgba(255, 224, 174, .44);\n    background: rgba(255, 239, 210, .19);\n    box-shadow:\n      0 8px 19px rgba(45, 25, 23, .18),\n      inset 0 0 0 1px rgba(255, 255, 255, .14);\n  }\n\n  #honeyLibraryMatch27 .opm-floatBtn:disabled {\n    opacity: .48;\n    cursor: not-allowed;\n  }\n\n  #honeyLibraryMatch27 .opm-soundBtn {\n    left: clamp(8px, 1.2vmin, 14px);\n  }\n\n  #honeyLibraryMatch27 .opm-floatBtn.opm-pauseBtn {\n    left: calc(clamp(8px, 1.2vmin, 14px) + clamp(34px, 4.4vmin, 46px) + clamp(7px, 1vmin, 10px));\n    padding: 0;\n  }\n\n  #honeyLibraryMatch27 .opm-fullBtn {\n    right: clamp(8px, 1.2vmin, 14px);\n  }\n\n  #honeyLibraryMatch27 .opm-spk-back,\n  #honeyLibraryMatch27 .opm-spk-cone,\n  #honeyLibraryMatch27 .opm-spk-slash {\n    background: #fff1d6;\n  }\n\n  #honeyLibraryMatch27 .opm-spk-wave {\n    border-color: #fff1d6;\n    border-left-color: transparent;\n    border-top-color: transparent;\n    border-bottom-color: transparent;\n  }\n\n  #honeyLibraryMatch27 .opm-fullIcon {\n    background:\n      linear-gradient(#fff1d6, #fff1d6) left top \/ 10px 3px no-repeat,\n      linear-gradient(#fff1d6, #fff1d6) left top \/ 3px 10px no-repeat,\n      linear-gradient(#fff1d6, #fff1d6) right top \/ 10px 3px no-repeat,\n      linear-gradient(#fff1d6, #fff1d6) right top \/ 3px 10px no-repeat,\n      linear-gradient(#fff1d6, #fff1d6) left bottom \/ 10px 3px no-repeat,\n      linear-gradient(#fff1d6, #fff1d6) left bottom \/ 3px 10px no-repeat,\n      linear-gradient(#fff1d6, #fff1d6) right bottom \/ 10px 3px no-repeat,\n      linear-gradient(#fff1d6, #fff1d6) right bottom \/ 3px 10px no-repeat;\n  }\n\n  #honeyLibraryMatch27 .opm-pauseIcon {\n    position: relative;\n    width: 23px;\n    height: 23px;\n    display: block;\n    color: #fff1d6;\n    filter: drop-shadow(0 0 5px rgba(215, 168, 86, .44));\n  }\n\n  #honeyLibraryMatch27 .opm-pauseIcon::before,\n  #honeyLibraryMatch27 .opm-pauseIcon::after {\n    content: \"\";\n    position: absolute;\n    top: 5px;\n    width: 4px;\n    height: 13px;\n    border-radius: 999px;\n    background: currentColor;\n  }\n\n  #honeyLibraryMatch27 .opm-pauseIcon::before { left: 7px; }\n  #honeyLibraryMatch27 .opm-pauseIcon::after { right: 7px; }\n\n  #honeyLibraryMatch27 .opm-pauseBtn.opm-isPaused .opm-pauseIcon::before {\n    left: 8px;\n    top: 4px;\n    width: 0;\n    height: 0;\n    border-left: 12px solid currentColor;\n    border-top: 7px solid transparent;\n    border-bottom: 7px solid transparent;\n    border-radius: 0;\n    background: transparent;\n  }\n\n  #honeyLibraryMatch27 .opm-pauseBtn.opm-isPaused .opm-pauseIcon::after {\n    display: none;\n  }\n\n  #honeyLibraryMatch27 .opm-toast {\n    background: rgba(255, 239, 210, .94);\n    color: #3b2a25;\n    box-shadow:\n      0 11px 25px rgba(59, 42, 37, .2),\n      inset 0 0 0 1px rgba(255, 255, 255, .28);\n  }\n\n  #honeyLibraryMatch27 .opm-overlay {\n    background:\n      radial-gradient(circle at 50% 30%, rgba(255, 239, 210, .16), transparent 38%),\n      rgba(45, 25, 32, .5);\n  }\n\n  #honeyLibraryMatch27 .opm-card {\n    background:\n      radial-gradient(circle at 28% 16%, rgba(255, 255, 255, .6), transparent 29%),\n      linear-gradient(145deg, rgba(255, 244, 222, .97), rgba(233, 188, 137, .9));\n    border-color: rgba(255, 255, 255, .56);\n    box-shadow:\n      0 24px 58px rgba(45, 25, 23, .34),\n      inset 0 0 0 1px rgba(255, 255, 255, .22);\n  }\n\n  #honeyLibraryMatch27 .opm-titleMark {\n    background:\n      radial-gradient(circle at 45% 43%, #fff7e2 0 12px, #d7a856 13px 17px, #c96f7d 18px 23px, rgba(91, 56, 40, .82) 24px 100%);\n    box-shadow:\n      0 0 22px rgba(215, 168, 86, .34),\n      0 10px 24px rgba(59, 42, 37, .16);\n  }\n\n  #honeyLibraryMatch27 .opm-message {\n    color: #3b2a25;\n  }\n\n  #honeyLibraryMatch27 .opm-small {\n    color: rgba(59, 42, 37, .78);\n  }\n\n  #honeyLibraryMatch27 .opm-start {\n    background: linear-gradient(145deg, #9a5f35, #d7a856);\n    color: #fffdf1;\n    box-shadow: 0 12px 25px rgba(154, 95, 53, .32);\n  }\n\n  #honeyLibraryMatch27:fullscreen,\n  #honeyLibraryMatch27.opm-ios-fullscreen {\n    background: #2b1f2a;\n  }\n\n  @media (max-height: 520px) {\n    #honeyLibraryMatch27 .opm-topbar {\n      padding-left: 82px;\n      padding-right: 70px;\n      padding-bottom: 9px;\n    }\n\n    #honeyLibraryMatch27 .opm-timerline {\n      top: 45px;\n    }\n\n    #honeyLibraryMatch27 .opm-boardShell {\n      padding-top: 9px;\n    }\n\n    #honeyLibraryMatch27 .opm-action {\n      min-width: 92px;\n    }\n  }\n\n  @keyframes opmThreadTileVanish {\n    0% { transform: scale(.98); opacity: 1; filter: brightness(1); }\n    42% { transform: scale(1.11); opacity: .95; filter: brightness(1.14); }\n    100% { transform: scale(.72); opacity: 0; filter: brightness(1.24) blur(.4px); }\n  }\n\n  @keyframes opmThreadIconFloat {\n    0% { transform: translateY(0) rotate(0deg); opacity: 1; }\n    100% { transform: translateY(-7px) rotate(7deg); opacity: 0; }\n  }\n\n  @keyframes opmThreadBloom {\n    0% { transform: scale(.25) rotate(0deg); opacity: 0; }\n    35% { opacity: 1; }\n    100% { transform: scale(1.35) rotate(28deg); opacity: 0; }\n  }\n\n\n\n  \/* Fullscreen polish: let the cloud laundry board frame breathe with the device instead of staying capped at desktop size. *\/\n  #honeyLibraryMatch27:fullscreen .opm-boardShell,\n  #honeyLibraryMatch27.opm-ios-fullscreen .opm-boardShell {\n    padding-top: clamp(8px, 1.5vh, 22px);\n    padding-bottom: clamp(8px, 1.5vh, 22px);\n  }\n\n  #honeyLibraryMatch27:fullscreen .opm-boardShell::before,\n  #honeyLibraryMatch27.opm-ios-fullscreen .opm-boardShell::before {\n    width: calc(100% - clamp(18px, 2.4vw, 48px));\n    height: calc(100% - clamp(16px, 2.2vh, 42px));\n    max-width: none;\n    max-height: none;\n  }\n\n  #honeyLibraryMatch27.opm-rotateFS .opm-boardShell::before {\n    width: calc(100% - clamp(16px, 2.4vh, 42px));\n    height: calc(100% - clamp(14px, 2.2vw, 38px));\n    max-width: none;\n    max-height: none;\n  }\n\n  \/* Keep the match vanish focused on the matched pair only. *\/\n  #honeyLibraryMatch27.opm-matching .opm-tile:not(.opm-match):not(.opm-selected) {\n    transform: none !important;\n    animation: none !important;\n  }\n\n  #honeyLibraryMatch27.opm-matching .opm-tile:not(.opm-match):not(.opm-selected)::before {\n    transition: background .13s ease, box-shadow .13s ease, inset .13s ease;\n  }\n\n  @media (hover: hover) and (pointer: fine) {\n    #honeyLibraryMatch27:not(.opm-matching) .opm-tile:hover {\n      transform: translateY(-2px) scale(1.025);\n    }\n  }\n\n  @media (hover: none), (pointer: coarse) {\n    #honeyLibraryMatch27 .opm-tile:hover {\n      transform: none;\n    }\n  }\n\n\n  \/* Final fullscreen shape fix: keep the board width, but make the marked board frame less tall. *\/\n  #honeyLibraryMatch27:fullscreen .opm-boardShell::before,\n  #honeyLibraryMatch27.opm-ios-fullscreen .opm-boardShell::before {\n    width: calc(100% - clamp(18px, 2.4vw, 48px));\n    height: auto;\n    aspect-ratio: 2.38 \/ 1;\n    max-height: calc(100% - clamp(54px, 7vh, 96px));\n  }\n\n  #honeyLibraryMatch27.opm-rotateFS .opm-boardShell::before {\n    width: calc(100% - clamp(16px, 2.4vh, 42px));\n    height: auto;\n    aspect-ratio: 2.38 \/ 1;\n    max-height: calc(100% - clamp(48px, 7vw, 88px));\n  }\n\n  \/* Final anti-wobble pass: no hover lift and no transform transition on idle tiles. *\/\n  #honeyLibraryMatch27 .opm-tile {\n    transition: opacity .18s ease, filter .15s ease !important;\n  }\n\n  #honeyLibraryMatch27 .opm-tile:hover {\n    transform: none !important;\n  }\n\n  #honeyLibraryMatch27 .opm-tile.opm-selected {\n    transform: scale(.985) !important;\n  }\n\n  #honeyLibraryMatch27.opm-matching .opm-tile:not(.opm-match) {\n    transform: none !important;\n    animation: none !important;\n    transition: none !important;\n  }\n\n  #honeyLibraryMatch27.opm-matching .opm-tile:not(.opm-match) svg {\n    animation: none !important;\n  }\n\n\n\n  \/* Final layout polish requested: larger top info panel, manual board frame tuning, and tighter square tile spacing. *\/\n  #honeyLibraryMatch27 .opm-topbar {\n    min-height: clamp(42px, 4.9vmin, 54px);\n    padding: clamp(3px, .65vmin, 8px) 82px clamp(7px, .85vmin, 11px);\n    gap: clamp(5px, .72vmin, 9px);\n    align-items: center;\n  }\n\n  #honeyLibraryMatch27 .opm-chip {\n    min-width: clamp(56px, 5.4vmin, 70px);\n    min-height: clamp(34px, 4.1vmin, 45px);\n    padding: clamp(5px, .72vmin, 8px) clamp(8px, .95vmin, 12px);\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n  }\n\n  #honeyLibraryMatch27 .opm-chip span {\n    font-size: clamp(7.5px, .9vmin, 10px);\n  }\n\n  #honeyLibraryMatch27 .opm-chip b {\n    font-size: clamp(12px, 1.55vmin, 17px);\n  }\n\n  #honeyLibraryMatch27 .opm-floatBtn {\n    width: clamp(40px, 4.8vmin, 50px);\n    height: clamp(40px, 4.8vmin, 50px);\n  }\n\n  #honeyLibraryMatch27 .opm-timerline {\n    top: clamp(66px, 7.1vmin, 80px);\n  }\n\n  #honeyLibraryMatch27:fullscreen .opm-topbar,\n  #honeyLibraryMatch27.opm-ios-fullscreen .opm-topbar {\n    min-height: clamp(46px, 5.2vmin, 58px);\n    padding-left: clamp(96px, 9vw, 128px);\n    padding-right: clamp(86px, 8vw, 118px);\n  }\n\n  #honeyLibraryMatch27:fullscreen .opm-boardShell,\n  #honeyLibraryMatch27.opm-ios-fullscreen .opm-boardShell {\n    padding-top: clamp(14px, 2vh, 30px);\n    padding-bottom: clamp(14px, 2vh, 30px);\n  }\n\n  #honeyLibraryMatch27:fullscreen .opm-boardShell::before,\n  #honeyLibraryMatch27.opm-ios-fullscreen .opm-boardShell::before {\n    width: calc(100% - var(--ebm-fullscreen-board-inset));\n    height: auto;\n    aspect-ratio: var(--ebm-fullscreen-board-ratio);\n    max-height: calc(100% - var(--ebm-fullscreen-board-max-height-gap));\n  }\n\n  #honeyLibraryMatch27.opm-rotateFS .opm-boardShell::before {\n    width: calc(100% - var(--ebm-fullscreen-board-inset));\n    height: auto;\n    aspect-ratio: var(--ebm-fullscreen-board-ratio);\n    max-height: calc(100% - var(--ebm-fullscreen-board-max-height-gap));\n  }\n\n  @media (max-height: 520px) {\n    #honeyLibraryMatch27 .opm-topbar {\n      min-height: 40px;\n      padding-top: 2px;\n      padding-bottom: 8px;\n      gap: 5px;\n    }\n\n    #honeyLibraryMatch27 .opm-chip {\n      min-width: 52px;\n      min-height: 32px;\n      padding: 4px 7px;\n    }\n\n    #honeyLibraryMatch27 .opm-timerline {\n      top: 50px;\n    }\n  }\n\n\n\n  \/* Final tuning: bigger lower buttons, slightly raised controls, taller fullscreen board, and tighter tile spacing. *\/\n  #honeyLibraryMatch27 {\n    --ebm-fullscreen-board-ratio: 2.10 \/ 1;\n    --ebm-fullscreen-grid-scale: .94;\n    --ebm-tile-fill: .985;\n  }\n\n  #honeyLibraryMatch27 .opm-bottom {\n    gap: clamp(12px, 1.55vmin, 20px);\n    padding-top: 0;\n    padding-bottom: clamp(7px, 1.15vmin, 14px);\n    transform: translateY(clamp(-5px, -0.72vmin, -2px));\n  }\n\n  #honeyLibraryMatch27 .opm-action {\n    min-width: clamp(130px, 12.5vmin, 158px);\n    min-height: clamp(40px, 4.7vmin, 52px);\n    padding: clamp(10px, 1.25vmin, 14px) clamp(18px, 2.05vmin, 26px);\n    font-size: clamp(12px, 1.35vmin, 16px);\n    border-radius: 999px;\n  }\n\n  #honeyLibraryMatch27:fullscreen .opm-boardShell,\n  #honeyLibraryMatch27.opm-ios-fullscreen .opm-boardShell {\n    padding-top: clamp(10px, 1.7vh, 24px);\n    padding-bottom: clamp(10px, 1.7vh, 24px);\n  }\n\n  #honeyLibraryMatch27:fullscreen .opm-boardShell::before,\n  #honeyLibraryMatch27.opm-ios-fullscreen .opm-boardShell::before,\n  #honeyLibraryMatch27.opm-rotateFS .opm-boardShell::before {\n    aspect-ratio: var(--ebm-fullscreen-board-ratio);\n  }\n\n  @media (max-height: 520px) {\n    #honeyLibraryMatch27 .opm-bottom {\n      padding-bottom: 4px;\n      transform: translateY(-2px);\n      gap: 8px;\n    }\n\n    #honeyLibraryMatch27 .opm-action {\n      min-width: 104px;\n      min-height: 34px;\n      padding: 7px 12px;\n      font-size: 11px;\n    }\n  }\n\n\n  \/* Honey Library Match final skin - blueprint implementation *\/\n  #honeyLibraryMatch27 {\n    --ft-midnight-plum:#2F2231;\n    --ft-cocoa:#4B342C;\n    --ft-walnut:#6A4A3C;\n    --ft-lavender:#8B7298;\n    --ft-rose:#B97A8E;\n    --ft-gold:#D6B16A;\n    --ft-glow:#F7E8A3;\n    --ft-sage:#8FA78A;\n    --ft-linen:#F3E9DC;\n    --ft-cream:#FFF7EB;\n    color:#3B2A25;\n  }\n\n  #honeyLibraryMatch27 .opm-frame {\n    background:\n      radial-gradient(circle at 15% 12%, rgba(247,232,163,.28), transparent 23%),\n      radial-gradient(circle at 78% 14%, rgba(185,122,142,.22), transparent 27%),\n      radial-gradient(circle at 24% 84%, rgba(143,167,138,.20), transparent 30%),\n      radial-gradient(circle at 84% 84%, rgba(139,114,152,.22), transparent 30%),\n      linear-gradient(148deg, #2F2231 0%, #3B2839 36%, #4B342C 70%, #6A4A3C 100%);\n    border-color:rgba(214,177,106,.46);\n    box-shadow:0 24px 58px rgba(34,22,30,.38), inset 0 0 0 1px rgba(255,247,235,.12);\n  }\n\n  #honeyLibraryMatch27 .opm-frame::before {\n    background:\n      radial-gradient(ellipse at 52% -18%, rgba(255,247,235,.30), transparent 44%),\n      linear-gradient(to bottom, rgba(255,247,235,.14), rgba(255,247,235,0) 38%),\n      repeating-linear-gradient(90deg, rgba(255,247,235,.035) 0 1px, transparent 1px 34px),\n      repeating-linear-gradient(0deg, rgba(214,177,106,.025) 0 1px, transparent 1px 30px),\n      radial-gradient(circle at 10% 32%, rgba(247,232,163,.72) 0 2px, transparent 3px),\n      radial-gradient(circle at 88% 34%, rgba(247,232,163,.58) 0 2px, transparent 3px),\n      radial-gradient(circle at 64% 22%, rgba(247,232,163,.40) 0 1.5px, transparent 2.5px),\n      radial-gradient(circle at 36% 72%, rgba(247,232,163,.38) 0 1.5px, transparent 2.5px);\n    opacity:.96;\n  }\n\n  #honeyLibraryMatch27 .opm-frame::after {\n    background:\n      radial-gradient(ellipse at 17% 96%, rgba(75,52,44,.82), transparent 30%),\n      radial-gradient(ellipse at 38% 100%, rgba(185,122,142,.20), transparent 26%),\n      radial-gradient(ellipse at 60% 100%, rgba(214,177,106,.20), transparent 31%),\n      radial-gradient(ellipse at 84% 98%, rgba(143,167,138,.18), transparent 26%);\n  }\n\n  #honeyLibraryMatch27 .opm-bubbles {\n    opacity:.92;\n    background:\n      radial-gradient(circle at 12% 26%, rgba(247,232,163,.68) 0 2px, transparent 3px),\n      radial-gradient(circle at 27% 58%, rgba(255,247,235,.26) 0 2px, transparent 3px),\n      radial-gradient(circle at 79% 34%, rgba(247,232,163,.52) 0 2px, transparent 3px),\n      radial-gradient(circle at 89% 68%, rgba(185,122,142,.26) 0 3px, transparent 4px),\n      radial-gradient(circle at 52% 20%, rgba(214,177,106,.30) 0 2px, transparent 3px),\n      radial-gradient(circle at 43% 78%, rgba(255,247,235,.22) 0 1px, transparent 2px),\n      linear-gradient(120deg, transparent 0 18%, rgba(255,247,235,.04) 18% 19%, transparent 19% 100%);\n  }\n\n  #honeyLibraryMatch27 .opm-topbar {\n    padding: clamp(3px, .65vmin, 8px) 88px clamp(8px, .9vmin, 12px);\n  }\n\n  #honeyLibraryMatch27 .opm-chip {\n    background:rgba(243,233,220,.88);\n    border-color:rgba(214,177,106,.52);\n    box-shadow:0 9px 20px rgba(47,34,49,.18), inset 0 0 0 1px rgba(255,255,255,.30), inset 0 -7px 12px rgba(106,74,60,.06);\n  }\n\n  #honeyLibraryMatch27 .opm-chip span { color:rgba(59,42,37,.72); }\n  #honeyLibraryMatch27 .opm-chip b { color:#3B2A25; }\n  #honeyLibraryMatch27 .opm-timeChip b { color:#9A6E36; }\n  #honeyLibraryMatch27 .opm-comboChip b { color:#8B7298; }\n\n  #honeyLibraryMatch27 .opm-timerline {\n    background:rgba(47,34,49,.34);\n    border:1px solid rgba(214,177,106,.26);\n    box-shadow:inset 0 0 0 1px rgba(255,247,235,.10), 0 5px 14px rgba(47,34,49,.18);\n  }\n\n  #honeyLibraryMatch27 .opm-timerfill {\n    background:linear-gradient(90deg, #8FA78A 0%, #D6B16A 55%, #B97A8E 100%);\n    box-shadow:0 0 16px rgba(247,232,163,.46), 0 0 5px rgba(214,177,106,.35);\n  }\n\n  #honeyLibraryMatch27 .opm-boardShell::before {\n    background:\n      radial-gradient(circle at 50% 20%, rgba(247,232,163,.08), transparent 36%),\n      linear-gradient(145deg, rgba(75,52,44,.56), rgba(47,34,49,.34)),\n      repeating-linear-gradient(90deg, rgba(255,247,235,.035) 0 1px, transparent 1px 28px),\n      repeating-linear-gradient(0deg, rgba(255,247,235,.025) 0 1px, transparent 1px 28px);\n    border:1.5px solid rgba(214,177,106,.38);\n    box-shadow:0 18px 44px rgba(47,34,49,.22), inset 0 0 0 1px rgba(255,247,235,.055), inset 0 0 36px rgba(247,232,163,.05);\n  }\n\n  #honeyLibraryMatch27 .opm-lines polyline {\n    stroke:rgba(255,247,235,.98);\n    stroke-width:6.5;\n    filter:drop-shadow(0 0 7px rgba(247,232,163,.72)) drop-shadow(0 3px 5px rgba(47,34,49,.28));\n  }\n\n  #honeyLibraryMatch27 .opm-lines polyline.opm-hintline {\n    stroke:rgba(247,232,163,.98);\n    stroke-dasharray:8 7;\n    filter:drop-shadow(0 0 8px rgba(247,232,163,.68)) drop-shadow(0 2px 4px rgba(47,34,49,.24));\n  }\n\n  #honeyLibraryMatch27 .opm-tile::before {\n    border:1px solid rgba(214,177,106,.56);\n    background:\n      radial-gradient(circle at 32% 22%, rgba(255,255,255,.75), transparent 24%),\n      linear-gradient(145deg, rgba(255,247,235,.98), rgba(243,233,220,.88));\n    box-shadow:0 8px 17px rgba(47,34,49,.24), inset 0 0 0 1px rgba(255,255,255,.62), inset 0 -8px 16px rgba(106,74,60,.08);\n  }\n\n  #honeyLibraryMatch27 .opm-tile svg {\n    width:91%;\n    height:91%;\n    filter:drop-shadow(0 1px 1px rgba(47,34,49,.18)) drop-shadow(0 3px 5px rgba(47,34,49,.09));\n  }\n\n  #honeyLibraryMatch27 .opm-tile.opm-selected::before {\n    background:\n      radial-gradient(circle at 32% 24%, rgba(255,255,255,.82), transparent 24%),\n      linear-gradient(145deg, rgba(255,247,235,.98), rgba(247,232,163,.72));\n    box-shadow:0 0 0 3px rgba(247,232,163,.70), 0 0 22px rgba(247,232,163,.44), 0 10px 22px rgba(47,34,49,.24);\n  }\n\n  #honeyLibraryMatch27 .opm-tile.opm-wrong::before {\n    box-shadow:0 0 0 3px rgba(185,122,142,.76), 0 0 20px rgba(185,122,142,.38), 0 8px 17px rgba(47,34,49,.22);\n  }\n\n  #honeyLibraryMatch27 .opm-tile .opm-threadFx {\n    inset:-48%;\n    background:\n      radial-gradient(circle at 50% 50%, rgba(247,232,163,.95) 0 5%, transparent 6%),\n      radial-gradient(circle at 28% 24%, rgba(255,247,235,.88) 0 3.8%, transparent 4.6%),\n      radial-gradient(circle at 72% 30%, rgba(214,177,106,.82) 0 3.5%, transparent 4.4%),\n      radial-gradient(circle at 18% 68%, rgba(143,167,138,.70) 0 3.5%, transparent 4.4%),\n      radial-gradient(circle at 80% 74%, rgba(185,122,142,.62) 0 3.5%, transparent 4.4%);\n    animation:opmCloudLaundryLegacyBloom .48s ease forwards;\n    filter:drop-shadow(0 0 10px rgba(247,232,163,.56));\n  }\n\n  #honeyLibraryMatch27 .opm-action {\n    color:#3B2A25;\n    background:radial-gradient(circle at 34% 18%, rgba(255,255,255,.72), transparent 28%), linear-gradient(145deg, rgba(255,247,235,.96), rgba(214,177,106,.68));\n    border-color:rgba(214,177,106,.55);\n    box-shadow:0 10px 22px rgba(47,34,49,.22), inset 0 0 0 1px rgba(255,255,255,.32);\n  }\n\n  #honeyLibraryMatch27 .opm-shuffleBtn {\n    background:radial-gradient(circle at 34% 18%, rgba(255,255,255,.68), transparent 28%), linear-gradient(145deg, rgba(255,247,235,.96), rgba(185,122,142,.64));\n  }\n\n  #honeyLibraryMatch27 .opm-floatBtn {\n    background:rgba(47,34,49,.42);\n    border-color:rgba(214,177,106,.50);\n    box-shadow:0 8px 20px rgba(34,22,30,.24), inset 0 0 0 1px rgba(255,247,235,.12);\n  }\n\n  #honeyLibraryMatch27 .opm-spk-back,\n  #honeyLibraryMatch27 .opm-spk-cone,\n  #honeyLibraryMatch27 .opm-spk-slash { background:#FFF7EB; }\n\n  #honeyLibraryMatch27 .opm-spk-wave {\n    border-color:#FFF7EB;\n    border-left-color:transparent;\n    border-top-color:transparent;\n    border-bottom-color:transparent;\n  }\n\n  #honeyLibraryMatch27 .opm-fullIcon {\n    background:\n      linear-gradient(#FFF7EB,#FFF7EB) left top \/ 10px 3px no-repeat,\n      linear-gradient(#FFF7EB,#FFF7EB) left top \/ 3px 10px no-repeat,\n      linear-gradient(#FFF7EB,#FFF7EB) right top \/ 10px 3px no-repeat,\n      linear-gradient(#FFF7EB,#FFF7EB) right top \/ 3px 10px no-repeat,\n      linear-gradient(#FFF7EB,#FFF7EB) left bottom \/ 10px 3px no-repeat,\n      linear-gradient(#FFF7EB,#FFF7EB) left bottom \/ 3px 10px no-repeat,\n      linear-gradient(#FFF7EB,#FFF7EB) right bottom \/ 10px 3px no-repeat,\n      linear-gradient(#FFF7EB,#FFF7EB) right bottom \/ 3px 10px no-repeat;\n  }\n\n  #honeyLibraryMatch27 .opm-pauseIcon { color:#FFF7EB; filter:drop-shadow(0 0 6px rgba(247,232,163,.46)); }\n  #honeyLibraryMatch27 .opm-toast {\n    background:rgba(255,247,235,.95);\n    color:#3B2A25;\n    border:1px solid rgba(214,177,106,.34);\n    box-shadow:0 11px 26px rgba(47,34,49,.24), inset 0 0 0 1px rgba(255,255,255,.28);\n  }\n\n  #honeyLibraryMatch27 .opm-overlay {\n    background:radial-gradient(circle at 50% 30%, rgba(247,232,163,.15), transparent 38%), rgba(47,34,49,.58);\n  }\n\n  #honeyLibraryMatch27 .opm-card {\n    background:radial-gradient(circle at 28% 16%, rgba(255,255,255,.62), transparent 29%), linear-gradient(145deg, rgba(255,247,235,.98), rgba(243,233,220,.92));\n    border-color:rgba(255,255,255,.56);\n    box-shadow:0 26px 62px rgba(34,22,30,.38), inset 0 0 0 1px rgba(255,255,255,.24);\n  }\n\n  #honeyLibraryMatch27 .opm-titleMark {\n    position:relative;\n    background:radial-gradient(circle at 50% 46%, #F7E8A3 0 10px, #D6B16A 11px 15px, #8B7298 16px 22px, rgba(75,52,44,.88) 23px 100%);\n    box-shadow:0 0 24px rgba(247,232,163,.38), 0 10px 24px rgba(47,34,49,.18);\n  }\n\n  #honeyLibraryMatch27 .opm-titleMark::before,\n  #honeyLibraryMatch27 .opm-titleMark::after {\n    content:\"\";\n    position:absolute;\n    border-radius:50%;\n    background:#F7E8A3;\n    box-shadow:0 0 10px rgba(247,232,163,.8);\n  }\n\n  #honeyLibraryMatch27 .opm-titleMark::before { width:7px; height:7px; left:12px; top:17px; }\n  #honeyLibraryMatch27 .opm-titleMark::after { width:5px; height:5px; right:13px; top:13px; }\n\n  #honeyLibraryMatch27 .opm-message { color:#3B2A25; }\n  #honeyLibraryMatch27 .opm-small { color:rgba(59,42,37,.78); }\n  #honeyLibraryMatch27 .opm-start {\n    background:linear-gradient(145deg, #8B7298, #D6B16A);\n    color:#FFFDF1;\n    box-shadow:0 13px 27px rgba(139,114,152,.32);\n  }\n\n  #honeyLibraryMatch27:fullscreen,\n  #honeyLibraryMatch27.opm-ios-fullscreen { background:#2F2231; }\n\n  @keyframes opmCloudLaundryLegacyBloom {\n    0% { transform:scale(.25) rotate(0deg); opacity:0; }\n    35% { opacity:1; }\n    100% { transform:scale(1.42) rotate(36deg); opacity:0; }\n  }\n\n\n  \/* Save\/continue + deadlock shuffle popup polish *\/\n  #honeyLibraryMatch27 .opm-startGroup{\n    display:flex;\n    flex-direction:column;\n    align-items:center;\n    justify-content:center;\n    gap:10px;\n    margin-top:2px;\n  }\n\n  #honeyLibraryMatch27 .opm-saveBtn,\n  #honeyLibraryMatch27 .opm-continueBtn{\n    border:0;\n    border-radius:999px;\n    min-width:158px;\n    padding:12px 24px;\n    background:\n      radial-gradient(circle at 36% 18%, rgba(255,255,255,.56), transparent 29%),\n      linear-gradient(145deg, #B97A8E, #D6B16A);\n    color:#FFF7EB;\n    font-weight:950;\n    font-size:15px;\n    cursor:pointer;\n    box-shadow:0 12px 26px rgba(59,42,37,.24), inset 0 0 0 1px rgba(255,255,255,.18);\n  }\n\n  #honeyLibraryMatch27 .opm-saveBtn{\n    background:\n      radial-gradient(circle at 36% 18%, rgba(255,255,255,.48), transparent 29%),\n      linear-gradient(145deg, #8FA78A, #6A4A3C);\n  }\n\n  #honeyLibraryMatch27 .opm-saveBtn[hidden],\n  #honeyLibraryMatch27 .opm-continueBtn[hidden]{\n    display:none !important;\n  }\n\n  #honeyLibraryMatch27 .opm-start:hover,\n  #honeyLibraryMatch27 .opm-saveBtn:hover,\n  #honeyLibraryMatch27 .opm-continueBtn:hover{\n    filter:brightness(1.04);\n    transform:translateY(-1px);\n  }\n\n  #honeyLibraryMatch27 .opm-spk-slash{\n    left:-2px !important;\n    background:#d94a4a !important;\n    box-shadow:0 0 0 1px rgba(77,34,32,.25), 0 0 8px rgba(217,74,74,.46) !important;\n  }\n\n\n  \/* Final requested polish: larger artwork inside each tile, while keeping tile spacing tight. *\/\n  #honeyLibraryMatch27 .opm-tile svg{\n    width:100% !important;\n    height:100% !important;\n    transform:scale(1.10);\n    transform-origin:center;\n  }\n\n  #honeyLibraryMatch27 .opm-spk-slash{\n    left:-4px !important;\n    background:#d94a4a !important;\n  }\n\n\n\n  \/* =========================================================\n     Honey Library Match - Final Visual Redesign Layer\n     Mechanics preserved. Visual skin, palette, assets, effects, and UI changed.\n     ========================================================= *\/\n  #honeyLibraryMatch27 {\n    --cl-sky:#DDF0FA;\n    --cl-sky-2:#B7D7F2;\n    --cl-blue:#8FC4EF;\n    --cl-blue-deep:#5F93BF;\n    --cl-ink:#254867;\n    --cl-text:#55738F;\n    --cl-white:#FFFFFF;\n    --cl-foam:#F8FCFF;\n    --cl-soft:#EAF6FD;\n    --cl-mist:#A9C2D8;\n    --cl-linen:#F7F3EA;\n    --cl-mint:#D8F0EA;\n    color:#254867;\n  }\n\n  #honeyLibraryMatch27 .opm-frame {\n    background:\n      radial-gradient(circle at 14% 10%, rgba(255,255,255,.92), transparent 23%),\n      radial-gradient(circle at 82% 12%, rgba(221,240,250,.82), transparent 28%),\n      radial-gradient(circle at 20% 86%, rgba(183,215,242,.46), transparent 30%),\n      radial-gradient(circle at 88% 84%, rgba(247,243,234,.34), transparent 30%),\n      linear-gradient(155deg, #F8FCFF 0%, #DDF0FA 42%, #B7D7F2 100%) !important;\n    border:1px solid rgba(255,255,255,.78) !important;\n    box-shadow:\n      0 22px 54px rgba(88,130,168,.22),\n      inset 0 0 0 1px rgba(255,255,255,.62) !important;\n  }\n\n  #honeyLibraryMatch27 .opm-frame::before {\n    background:\n      radial-gradient(ellipse at 48% -18%, rgba(255,255,255,.82), transparent 45%),\n      linear-gradient(to bottom, rgba(255,255,255,.48), rgba(255,255,255,0) 38%),\n      radial-gradient(ellipse at 8% 30%, rgba(255,255,255,.66) 0 7%, transparent 21%),\n      radial-gradient(ellipse at 52% 24%, rgba(255,255,255,.42) 0 5%, transparent 16%),\n      radial-gradient(ellipse at 88% 36%, rgba(255,255,255,.50) 0 7%, transparent 20%),\n      repeating-linear-gradient(112deg, rgba(255,255,255,.20) 0 1px, transparent 1px 34px) !important;\n    opacity:.9 !important;\n  }\n\n  #honeyLibraryMatch27 .opm-frame::after {\n    height:32% !important;\n    background:\n      radial-gradient(ellipse at 12% 96%, rgba(255,255,255,.94), transparent 32%),\n      radial-gradient(ellipse at 34% 100%, rgba(255,255,255,.90), transparent 30%),\n      radial-gradient(ellipse at 58% 98%, rgba(255,255,255,.86), transparent 32%),\n      radial-gradient(ellipse at 82% 96%, rgba(255,255,255,.88), transparent 29%) !important;\n    opacity:.92 !important;\n  }\n\n  #honeyLibraryMatch27 .opm-bubbles {\n    opacity:.82 !important;\n    background:\n      radial-gradient(circle at 12% 26%, rgba(255,255,255,.78) 0 3px, transparent 4px),\n      radial-gradient(circle at 28% 58%, rgba(221,240,250,.62) 0 4px, transparent 5px),\n      radial-gradient(circle at 78% 34%, rgba(255,255,255,.74) 0 3px, transparent 4px),\n      radial-gradient(circle at 88% 68%, rgba(183,215,242,.54) 0 5px, transparent 6px),\n      radial-gradient(circle at 52% 20%, rgba(255,255,255,.66) 0 3px, transparent 4px),\n      radial-gradient(circle at 42% 78%, rgba(234,246,253,.70) 0 2px, transparent 3px) !important;\n  }\n\n  #honeyLibraryMatch27 .opm-topbar {\n    padding: clamp(3px, .65vmin, 8px) 88px clamp(8px, .9vmin, 12px) !important;\n  }\n\n  #honeyLibraryMatch27 .opm-chip {\n    background:rgba(255,255,255,.86) !important;\n    border-color:rgba(116,168,216,.26) !important;\n    box-shadow:\n      0 9px 20px rgba(88,130,168,.14),\n      inset 0 0 0 1px rgba(255,255,255,.70),\n      inset 0 -7px 12px rgba(143,196,239,.08) !important;\n  }\n  #honeyLibraryMatch27 .opm-chip span { color:rgba(37,72,103,.70) !important; }\n  #honeyLibraryMatch27 .opm-chip b { color:#254867 !important; }\n  #honeyLibraryMatch27 .opm-timeChip b,\n  #honeyLibraryMatch27 .opm-comboChip b { color:#5F93BF !important; }\n\n  #honeyLibraryMatch27 .opm-timerline {\n    background:rgba(255,255,255,.48) !important;\n    border:1px solid rgba(116,168,216,.24) !important;\n    box-shadow:inset 0 0 0 1px rgba(255,255,255,.56), 0 5px 14px rgba(88,130,168,.14) !important;\n  }\n  #honeyLibraryMatch27 .opm-timerfill {\n    background:linear-gradient(90deg, #D8F0EA 0%, #8FC4EF 52%, #5F93BF 100%) !important;\n    box-shadow:0 0 15px rgba(143,196,239,.52) !important;\n  }\n\n  #honeyLibraryMatch27 .opm-boardShell::before {\n    background:\n      radial-gradient(circle at 50% 12%, rgba(255,255,255,.82), transparent 36%),\n      linear-gradient(145deg, rgba(255,255,255,.46), rgba(221,240,250,.32)),\n      repeating-linear-gradient(90deg, rgba(95,147,191,.05) 0 1px, transparent 1px 28px),\n      repeating-linear-gradient(0deg, rgba(95,147,191,.04) 0 1px, transparent 1px 28px) !important;\n    border:1.5px solid rgba(255,255,255,.62) !important;\n    box-shadow:0 18px 44px rgba(88,130,168,.16), inset 0 0 0 1px rgba(255,255,255,.55), inset 0 0 38px rgba(255,255,255,.22) !important;\n  }\n\n  #honeyLibraryMatch27 .opm-lines polyline {\n    stroke:rgba(255,255,255,.98) !important;\n    stroke-width:6.5 !important;\n    filter:drop-shadow(0 0 8px rgba(143,196,239,.78)) drop-shadow(0 3px 5px rgba(88,130,168,.24)) !important;\n  }\n  #honeyLibraryMatch27 .opm-lines polyline.opm-hintline {\n    stroke:rgba(221,240,250,.98) !important;\n    stroke-dasharray:8 7 !important;\n    filter:drop-shadow(0 0 8px rgba(143,196,239,.62)) drop-shadow(0 2px 4px rgba(88,130,168,.22)) !important;\n  }\n\n  #honeyLibraryMatch27 .opm-tile::before {\n    border:1px solid rgba(116,168,216,.24) !important;\n    background:\n      radial-gradient(circle at 32% 22%, rgba(255,255,255,.88), transparent 24%),\n      linear-gradient(145deg, rgba(255,255,255,.98), rgba(221,240,250,.88)) !important;\n    box-shadow:\n      0 8px 17px rgba(88,130,168,.18),\n      inset 0 0 0 1px rgba(255,255,255,.82),\n      inset 0 -8px 16px rgba(95,147,191,.08) !important;\n  }\n  #honeyLibraryMatch27 .opm-tile svg {\n    width:100% !important;\n    height:100% !important;\n    transform:scale(1.08) !important;\n    filter:drop-shadow(0 1px 1px rgba(37,72,103,.13)) drop-shadow(0 3px 5px rgba(88,130,168,.08)) !important;\n  }\n  #honeyLibraryMatch27 .opm-tile.opm-selected::before {\n    background:\n      radial-gradient(circle at 32% 24%, rgba(255,255,255,.94), transparent 24%),\n      linear-gradient(145deg, rgba(255,255,255,.98), rgba(183,215,242,.86)) !important;\n    box-shadow:0 0 0 3px rgba(143,196,239,.58), 0 0 22px rgba(221,240,250,.72), 0 10px 22px rgba(88,130,168,.20) !important;\n  }\n  #honeyLibraryMatch27 .opm-tile.opm-wrong::before {\n    box-shadow:0 0 0 3px rgba(214,107,107,.62), 0 0 20px rgba(214,107,107,.30), 0 8px 17px rgba(88,130,168,.20) !important;\n  }\n  #honeyLibraryMatch27 .opm-tile .opm-threadFx {\n    inset:-50% !important;\n    background:\n      radial-gradient(circle at 50% 50%, rgba(255,255,255,.98) 0 5%, transparent 6%),\n      radial-gradient(circle at 28% 24%, rgba(221,240,250,.92) 0 4%, transparent 5%),\n      radial-gradient(circle at 72% 30%, rgba(143,196,239,.82) 0 3.5%, transparent 4.5%),\n      radial-gradient(circle at 18% 68%, rgba(255,255,255,.82) 0 3.5%, transparent 4.5%),\n      radial-gradient(circle at 80% 74%, rgba(183,215,242,.72) 0 3.5%, transparent 4.5%) !important;\n    animation:opmLaundryBubbleBloom .50s ease forwards !important;\n    filter:drop-shadow(0 0 11px rgba(221,240,250,.75)) !important;\n  }\n\n  #honeyLibraryMatch27 .opm-action,\n  #honeyLibraryMatch27 .opm-start,\n  #honeyLibraryMatch27 .opm-saveBtn,\n  #honeyLibraryMatch27 .opm-continueBtn {\n    color:#FFFFFF !important;\n    background:radial-gradient(circle at 34% 18%, rgba(255,255,255,.45), transparent 28%), linear-gradient(145deg, #8FC4EF, #5F93BF) !important;\n    border-color:rgba(255,255,255,.62) !important;\n    box-shadow:0 10px 22px rgba(88,130,168,.22), inset 0 0 0 1px rgba(255,255,255,.24) !important;\n    text-shadow:0 1px 0 rgba(37,72,103,.16);\n  }\n  #honeyLibraryMatch27 .opm-shuffleBtn,\n  #honeyLibraryMatch27 .opm-saveBtn {\n    background:radial-gradient(circle at 34% 18%, rgba(255,255,255,.45), transparent 28%), linear-gradient(145deg, #D8F0EA, #72A9D6) !important;\n    color:#254867 !important;\n    text-shadow:none !important;\n  }\n  #honeyLibraryMatch27 .opm-action:hover,\n  #honeyLibraryMatch27 .opm-start:hover,\n  #honeyLibraryMatch27 .opm-saveBtn:hover,\n  #honeyLibraryMatch27 .opm-continueBtn:hover {\n    filter:brightness(1.04) !important;\n    transform:translateY(-1px);\n  }\n\n  #honeyLibraryMatch27 .opm-floatBtn {\n    background:rgba(255,255,255,.40) !important;\n    border-color:rgba(255,255,255,.62) !important;\n    box-shadow:0 8px 20px rgba(88,130,168,.18), inset 0 0 0 1px rgba(255,255,255,.22) !important;\n  }\n  #honeyLibraryMatch27 .opm-spk-back,\n  #honeyLibraryMatch27 .opm-spk-cone { background:#FFFFFF !important; }\n  #honeyLibraryMatch27 .opm-spk-wave {\n    border-color:#FFFFFF !important;\n    border-left-color:transparent !important;\n    border-top-color:transparent !important;\n    border-bottom-color:transparent !important;\n  }\n  #honeyLibraryMatch27 .opm-spk-slash {\n    left:-4px !important;\n    background:#D66B6B !important;\n  }\n  #honeyLibraryMatch27 .opm-fullIcon {\n    background:\n      linear-gradient(#FFFFFF,#FFFFFF) left top \/ 10px 3px no-repeat,\n      linear-gradient(#FFFFFF,#FFFFFF) left top \/ 3px 10px no-repeat,\n      linear-gradient(#FFFFFF,#FFFFFF) right top \/ 10px 3px no-repeat,\n      linear-gradient(#FFFFFF,#FFFFFF) right top \/ 3px 10px no-repeat,\n      linear-gradient(#FFFFFF,#FFFFFF) left bottom \/ 10px 3px no-repeat,\n      linear-gradient(#FFFFFF,#FFFFFF) left bottom \/ 3px 10px no-repeat,\n      linear-gradient(#FFFFFF,#FFFFFF) right bottom \/ 10px 3px no-repeat,\n      linear-gradient(#FFFFFF,#FFFFFF) right bottom \/ 3px 10px no-repeat !important;\n  }\n  #honeyLibraryMatch27 .opm-pauseIcon { color:#FFFFFF !important; filter:drop-shadow(0 0 6px rgba(221,240,250,.72)) !important; }\n\n  #honeyLibraryMatch27 .opm-toast {\n    background:rgba(255,255,255,.94) !important;\n    color:#254867 !important;\n    border:1px solid rgba(116,168,216,.22) !important;\n    box-shadow:0 11px 26px rgba(88,130,168,.20), inset 0 0 0 1px rgba(255,255,255,.55) !important;\n  }\n  #honeyLibraryMatch27 .opm-overlay {\n    background:radial-gradient(circle at 50% 30%, rgba(255,255,255,.24), transparent 38%), rgba(95,147,191,.30) !important;\n  }\n  #honeyLibraryMatch27 .opm-card {\n    background:radial-gradient(circle at 28% 16%, rgba(255,255,255,.90), transparent 29%), linear-gradient(145deg, rgba(255,255,255,.98), rgba(221,240,250,.92)) !important;\n    border-color:rgba(255,255,255,.72) !important;\n    box-shadow:0 26px 62px rgba(88,130,168,.26), inset 0 0 0 1px rgba(255,255,255,.64) !important;\n  }\n  #honeyLibraryMatch27 .opm-titleMark {\n    position:relative;\n    background:\n      radial-gradient(circle at 42% 40%, #FFFFFF 0 10px, #DDF0FA 11px 18px, #8FC4EF 19px 24px, rgba(95,147,191,.88) 25px 100%) !important;\n    box-shadow:0 0 24px rgba(221,240,250,.65), 0 10px 24px rgba(88,130,168,.18) !important;\n  }\n  #honeyLibraryMatch27 .opm-titleMark::before,\n  #honeyLibraryMatch27 .opm-titleMark::after {\n    content:\"\";\n    position:absolute;\n    border-radius:999px;\n    background:#FFFFFF;\n    box-shadow:0 0 10px rgba(221,240,250,.88);\n  }\n  #honeyLibraryMatch27 .opm-titleMark::before { width:16px; height:8px; left:11px; top:17px; }\n  #honeyLibraryMatch27 .opm-titleMark::after { width:10px; height:10px; right:12px; top:14px; }\n  #honeyLibraryMatch27 .opm-message { color:#254867 !important; }\n  #honeyLibraryMatch27 .opm-small { color:rgba(85,115,143,.86) !important; }\n\n  #honeyLibraryMatch27:fullscreen,\n  #honeyLibraryMatch27.opm-ios-fullscreen { background:#DDF0FA !important; }\n\n  @keyframes opmLaundryBubbleBloom {\n    0% { transform:scale(.20) rotate(0deg); opacity:0; }\n    35% { opacity:1; }\n    100% { transform:scale(1.46) rotate(16deg); opacity:0; }\n  }\n\n<\/style>\n\n<div id=\"honeyLibraryMatch27\">\n  <div class=\"opm-frame\">\n    <div class=\"opm-bubbles\" aria-hidden=\"true\"><\/div>\n\n    <button class=\"opm-floatBtn opm-soundBtn\" type=\"button\" aria-label=\"Mute or unmute sound\">\n      <span class=\"opm-soundIcon\" aria-hidden=\"true\">\n        <span class=\"opm-spk-back\"><\/span>\n        <span class=\"opm-spk-cone\"><\/span>\n        <span class=\"opm-spk-wave opm-spk-wave1\"><\/span>\n        <span class=\"opm-spk-wave opm-spk-wave2\"><\/span>\n        <span class=\"opm-spk-wave opm-spk-wave3\"><\/span>\n        <span class=\"opm-spk-slash\"><\/span>\n      <\/span>\n    <\/button>\n\n\n    <button class=\"opm-floatBtn opm-pauseBtn\" type=\"button\" aria-label=\"Pause\" disabled>\n      <span class=\"opm-pauseIcon\" aria-hidden=\"true\"><\/span>\n    <\/button>\n\n    <button class=\"opm-floatBtn opm-fullBtn\" type=\"button\" aria-label=\"Fullscreen\">\n      <span class=\"opm-fullIcon\" aria-hidden=\"true\"><\/span>\n    <\/button>\n\n    <div class=\"opm-topbar\">\n      <div class=\"opm-chip\"><span>Score<\/span><b class=\"opm-score\">0<\/b><\/div>\n      <div class=\"opm-chip\"><span>Best<\/span><b class=\"opm-best\">0<\/b><\/div>\n      <div class=\"opm-chip\"><span>Level<\/span><b class=\"opm-level\">1\/50<\/b><\/div>\n      <div class=\"opm-chip opm-timeChip\"><span>Time<\/span><b class=\"opm-time\">0<\/b><\/div>\n      <div class=\"opm-chip\"><span>Tiles<\/span><b class=\"opm-tiles\">0<\/b><\/div>\n      <div class=\"opm-chip\"><span>Types<\/span><b class=\"opm-types\">0<\/b><\/div>\n      <div class=\"opm-chip opm-comboChip\"><span>Combo<\/span><b class=\"opm-combo\">0<\/b><\/div>\n    <\/div>\n\n    <div class=\"opm-timerline\">\n      <div class=\"opm-timerfill\"><\/div>\n    <\/div>\n\n    <div class=\"opm-boardShell\">\n      <div class=\"opm-boardPad\">\n        <svg class=\"opm-lines\" aria-hidden=\"true\"><\/svg>\n        <div class=\"opm-board\" role=\"grid\" aria-label=\"Honey Library matching board\"><\/div>\n      <\/div>\n    <\/div>\n\n    <div class=\"opm-bottom\">\n      <button class=\"opm-action opm-hintBtn\" type=\"button\">Hint<\/button>\n      <button class=\"opm-action opm-shuffleBtn\" type=\"button\">Shuffle<\/button>\n    <\/div>\n\n    <div class=\"opm-toast\"><\/div>\n\n    <div class=\"opm-overlay\">\n      <div class=\"opm-card\">\n        <div class=\"opm-titleMark\" aria-hidden=\"true\"><\/div>\n        <p class=\"opm-message\">Honey Library Match<\/p>\n        <p class=\"opm-small\">Pair the glowing library treasures before the honeylight fades. Hint and Shuffle cost time, not score.<\/p>\n        <div class=\"opm-startGroup\">\n          <button class=\"opm-start\" type=\"button\">Open the Library<\/button>\n          <button class=\"opm-saveBtn\" type=\"button\" hidden>Save Game<\/button>\n          <button class=\"opm-continueBtn\" type=\"button\" hidden>Continue Game<\/button>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/div>\n\n\n\n<style>\n  \/* Honey Library Match - correct Pause\/Mute swap using actual wrapper ID *\/\n  #honeyLibraryMatch27 .opm-floatBtn.opm-pauseBtn {\n    left: clamp(8px, 1.2vmin, 14px) !important;\n    right: auto !important;\n  }\n\n  #honeyLibraryMatch27 .opm-soundBtn {\n    left: calc(clamp(8px, 1.2vmin, 14px) + clamp(40px, 4.8vmin, 50px) + clamp(7px, 1vmin, 10px)) !important;\n    right: auto !important;\n  }\n\n  #honeyLibraryMatch27 .opm-fullBtn {\n    right: clamp(8px, 1.2vmin, 14px) !important;\n    left: auto !important;\n  }\n\n  @media (max-height: 520px) {\n    #honeyLibraryMatch27 .opm-floatBtn.opm-pauseBtn {\n      left: clamp(7px, 1.2vmin, 13px) !important;\n    }\n\n    #honeyLibraryMatch27 .opm-soundBtn {\n      left: calc(clamp(7px, 1.2vmin, 13px) + 32px + 7px) !important;\n    }\n  }\n<\/style>\n\n\n<style>\n  \/* Honey Library Match - final skin override. Mechanics preserved. *\/\n  #honeyLibraryMatch27 {\n    --hl-ink:#3F2418;\n    --hl-cocoa:#5A321F;\n    --hl-walnut:#7A421F;\n    --hl-amber:#B87333;\n    --hl-honey:#F4C542;\n    --hl-glow:#FFE08A;\n    --hl-cream:#FFF1C9;\n    --hl-paper:#FFF8DF;\n    --hl-soft:#E9C875;\n    color:#3F2418;\n  }\n\n  #honeyLibraryMatch27 .opm-frame {\n    background:\n      radial-gradient(circle at 16% 10%, rgba(255, 241, 201, .56), transparent 24%),\n      radial-gradient(circle at 82% 14%, rgba(244, 197, 66, .34), transparent 28%),\n      radial-gradient(circle at 18% 86%, rgba(184, 115, 51, .30), transparent 30%),\n      radial-gradient(circle at 88% 84%, rgba(255, 224, 138, .24), transparent 30%),\n      linear-gradient(150deg, #2B1710 0%, #4B2A1B 34%, #7A421F 67%, #B87333 100%) !important;\n    border:1px solid rgba(255,241,201,.54) !important;\n    box-shadow:\n      0 24px 58px rgba(63,36,24,.36),\n      inset 0 0 0 1px rgba(255,248,223,.14) !important;\n  }\n\n  #honeyLibraryMatch27 .opm-frame::before {\n    background:\n      radial-gradient(ellipse at 50% -18%, rgba(255,248,223,.50), transparent 45%),\n      linear-gradient(to bottom, rgba(255,241,201,.22), rgba(255,241,201,0) 38%),\n      repeating-linear-gradient(90deg, rgba(255,241,201,.050) 0 1px, transparent 1px 36px),\n      repeating-linear-gradient(0deg, rgba(244,197,66,.035) 0 1px, transparent 1px 34px),\n      radial-gradient(circle at 10% 32%, rgba(255,224,138,.72) 0 2px, transparent 3px),\n      radial-gradient(circle at 88% 34%, rgba(255,224,138,.56) 0 2px, transparent 3px),\n      radial-gradient(circle at 65% 22%, rgba(255,248,223,.42) 0 1.5px, transparent 2.5px),\n      radial-gradient(circle at 35% 72%, rgba(244,197,66,.34) 0 1.5px, transparent 2.5px) !important;\n    opacity:.96 !important;\n  }\n\n  #honeyLibraryMatch27 .opm-frame::after {\n    height:31% !important;\n    background:\n      radial-gradient(ellipse at 15% 96%, rgba(63,36,24,.78), transparent 31%),\n      radial-gradient(ellipse at 36% 100%, rgba(184,115,51,.30), transparent 26%),\n      radial-gradient(ellipse at 60% 100%, rgba(244,197,66,.24), transparent 31%),\n      radial-gradient(ellipse at 84% 98%, rgba(255,241,201,.18), transparent 26%) !important;\n  }\n\n  #honeyLibraryMatch27 .opm-bubbles {\n    opacity:.90 !important;\n    background:\n      radial-gradient(circle at 12% 26%, rgba(255,241,201,.78) 0 2px, transparent 3px),\n      radial-gradient(circle at 28% 58%, rgba(244,197,66,.34) 0 2px, transparent 3px),\n      radial-gradient(circle at 78% 34%, rgba(255,248,223,.58) 0 2px, transparent 3px),\n      radial-gradient(circle at 88% 68%, rgba(255,224,138,.30) 0 3px, transparent 4px),\n      radial-gradient(circle at 52% 20%, rgba(244,197,66,.34) 0 2px, transparent 3px),\n      linear-gradient(120deg, transparent 0 18%, rgba(255,241,201,.045) 18% 19%, transparent 19% 100%) !important;\n  }\n\n  #honeyLibraryMatch27 .opm-chip {\n    background:rgba(255,248,223,.90) !important;\n    border-color:rgba(244,197,66,.44) !important;\n    box-shadow:\n      0 9px 20px rgba(63,36,24,.18),\n      inset 0 0 0 1px rgba(255,255,255,.34),\n      inset 0 -7px 12px rgba(154,95,53,.08) !important;\n  }\n  #honeyLibraryMatch27 .opm-chip span { color:rgba(63,36,24,.70) !important; }\n  #honeyLibraryMatch27 .opm-chip b { color:#3F2418 !important; }\n  #honeyLibraryMatch27 .opm-timeChip b,\n  #honeyLibraryMatch27 .opm-comboChip b { color:#9B6426 !important; }\n\n  #honeyLibraryMatch27 .opm-timerline {\n    background:rgba(63,36,24,.34) !important;\n    border:1px solid rgba(244,197,66,.28) !important;\n    box-shadow:inset 0 0 0 1px rgba(255,248,223,.12), 0 5px 14px rgba(63,36,24,.18) !important;\n  }\n  #honeyLibraryMatch27 .opm-timerfill {\n    background:linear-gradient(90deg, #FFF1C9 0%, #F4C542 55%, #B87333 100%) !important;\n    box-shadow:0 0 16px rgba(244,197,66,.52), 0 0 6px rgba(255,224,138,.38) !important;\n  }\n\n  #honeyLibraryMatch27 .opm-boardShell::before {\n    background:\n      radial-gradient(circle at 50% 18%, rgba(255,224,138,.12), transparent 36%),\n      linear-gradient(145deg, rgba(90,50,31,.58), rgba(43,23,16,.42)),\n      repeating-linear-gradient(90deg, rgba(255,241,201,.040) 0 1px, transparent 1px 28px),\n      repeating-linear-gradient(0deg, rgba(255,241,201,.030) 0 1px, transparent 1px 28px) !important;\n    border:1.5px solid rgba(244,197,66,.44) !important;\n    box-shadow:\n      0 18px 44px rgba(43,23,16,.28),\n      inset 0 0 0 1px rgba(255,248,223,.06),\n      inset 0 0 38px rgba(244,197,66,.06) !important;\n  }\n\n  #honeyLibraryMatch27 .opm-lines polyline {\n    stroke:rgba(255,248,223,.98) !important;\n    stroke-width:6.5 !important;\n    filter:drop-shadow(0 0 8px rgba(244,197,66,.76)) drop-shadow(0 3px 5px rgba(63,36,24,.30)) !important;\n  }\n  #honeyLibraryMatch27 .opm-lines polyline.opm-hintline {\n    stroke:rgba(255,224,138,.98) !important;\n    stroke-dasharray:8 7 !important;\n    filter:drop-shadow(0 0 8px rgba(244,197,66,.70)) drop-shadow(0 2px 4px rgba(63,36,24,.24)) !important;\n  }\n\n  #honeyLibraryMatch27 .opm-tile::before {\n    border:1px solid rgba(244,197,66,.50) !important;\n    background:\n      radial-gradient(circle at 32% 22%, rgba(255,255,255,.78), transparent 24%),\n      linear-gradient(145deg, rgba(255,248,223,.98), rgba(255,241,201,.90)) !important;\n    box-shadow:\n      0 8px 17px rgba(63,36,24,.24),\n      inset 0 0 0 1px rgba(255,255,255,.62),\n      inset 0 -8px 16px rgba(154,95,53,.10) !important;\n  }\n  #honeyLibraryMatch27 .opm-tile svg {\n    width:100% !important;\n    height:100% !important;\n    transform:scale(1.09) !important;\n    filter:drop-shadow(0 1px 1px rgba(63,36,24,.16)) drop-shadow(0 3px 5px rgba(63,36,24,.10)) !important;\n  }\n  #honeyLibraryMatch27 .opm-tile.opm-selected::before {\n    background:\n      radial-gradient(circle at 32% 24%, rgba(255,255,255,.84), transparent 24%),\n      linear-gradient(145deg, rgba(255,248,223,.99), rgba(255,224,138,.76)) !important;\n    box-shadow:0 0 0 3px rgba(244,197,66,.72), 0 0 22px rgba(244,197,66,.48), 0 10px 22px rgba(63,36,24,.24) !important;\n  }\n  #honeyLibraryMatch27 .opm-tile.opm-wrong::before {\n    box-shadow:0 0 0 3px rgba(194,65,45,.74), 0 0 20px rgba(194,65,45,.34), 0 8px 17px rgba(63,36,24,.22) !important;\n  }\n  #honeyLibraryMatch27 .opm-tile .opm-threadFx {\n    inset:-50% !important;\n    background:\n      radial-gradient(circle at 50% 50%, rgba(255,248,223,.98) 0 5%, transparent 6%),\n      radial-gradient(circle at 28% 24%, rgba(244,197,66,.90) 0 4%, transparent 5%),\n      radial-gradient(circle at 72% 30%, rgba(255,224,138,.82) 0 3.5%, transparent 4.5%),\n      radial-gradient(circle at 18% 68%, rgba(255,241,201,.84) 0 3.5%, transparent 4.5%),\n      radial-gradient(circle at 80% 74%, rgba(184,115,51,.62) 0 3.5%, transparent 4.5%) !important;\n    animation:opmHoneyLibraryBloom .50s ease forwards !important;\n    filter:drop-shadow(0 0 11px rgba(244,197,66,.72)) !important;\n  }\n\n  #honeyLibraryMatch27 .opm-action,\n  #honeyLibraryMatch27 .opm-start,\n  #honeyLibraryMatch27 .opm-saveBtn,\n  #honeyLibraryMatch27 .opm-continueBtn {\n    color:#FFF8DF !important;\n    background:radial-gradient(circle at 34% 18%, rgba(255,255,255,.42), transparent 28%), linear-gradient(145deg, #B87333, #7A421F) !important;\n    border-color:rgba(255,241,201,.56) !important;\n    box-shadow:0 10px 22px rgba(63,36,24,.26), inset 0 0 0 1px rgba(255,255,255,.18) !important;\n    text-shadow:0 1px 0 rgba(63,36,24,.18);\n  }\n  #honeyLibraryMatch27 .opm-shuffleBtn,\n  #honeyLibraryMatch27 .opm-saveBtn {\n    background:radial-gradient(circle at 34% 18%, rgba(255,255,255,.44), transparent 28%), linear-gradient(145deg, #F4C542, #9B6426) !important;\n    color:#3F2418 !important;\n    text-shadow:none !important;\n  }\n\n  #honeyLibraryMatch27 .opm-floatBtn {\n    background:rgba(63,36,24,.44) !important;\n    border-color:rgba(255,241,201,.48) !important;\n    box-shadow:0 8px 20px rgba(43,23,16,.25), inset 0 0 0 1px rgba(255,248,223,.12) !important;\n  }\n  #honeyLibraryMatch27 .opm-spk-back,\n  #honeyLibraryMatch27 .opm-spk-cone { background:#FFF8DF !important; }\n  #honeyLibraryMatch27 .opm-spk-wave {\n    border-color:#FFF8DF !important;\n    border-left-color:transparent !important;\n    border-top-color:transparent !important;\n    border-bottom-color:transparent !important;\n  }\n  #honeyLibraryMatch27 .opm-spk-slash { background:#C2412D !important; }\n  #honeyLibraryMatch27 .opm-fullIcon {\n    background:\n      linear-gradient(#FFF8DF,#FFF8DF) left top \/ 10px 3px no-repeat,\n      linear-gradient(#FFF8DF,#FFF8DF) left top \/ 3px 10px no-repeat,\n      linear-gradient(#FFF8DF,#FFF8DF) right top \/ 10px 3px no-repeat,\n      linear-gradient(#FFF8DF,#FFF8DF) right top \/ 3px 10px no-repeat,\n      linear-gradient(#FFF8DF,#FFF8DF) left bottom \/ 10px 3px no-repeat,\n      linear-gradient(#FFF8DF,#FFF8DF) left bottom \/ 3px 10px no-repeat,\n      linear-gradient(#FFF8DF,#FFF8DF) right bottom \/ 10px 3px no-repeat,\n      linear-gradient(#FFF8DF,#FFF8DF) right bottom \/ 3px 10px no-repeat !important;\n  }\n  #honeyLibraryMatch27 .opm-pauseIcon { color:#FFF8DF !important; filter:drop-shadow(0 0 6px rgba(244,197,66,.55)) !important; }\n\n  #honeyLibraryMatch27 .opm-toast {\n    background:rgba(255,248,223,.96) !important;\n    color:#3F2418 !important;\n    border:1px solid rgba(244,197,66,.34) !important;\n    box-shadow:0 11px 26px rgba(63,36,24,.24), inset 0 0 0 1px rgba(255,255,255,.34) !important;\n  }\n  #honeyLibraryMatch27 .opm-overlay {\n    background:radial-gradient(circle at 50% 30%, rgba(255,224,138,.18), transparent 38%), rgba(43,23,16,.58) !important;\n  }\n  #honeyLibraryMatch27 .opm-card {\n    background:radial-gradient(circle at 28% 16%, rgba(255,255,255,.62), transparent 29%), linear-gradient(145deg, rgba(255,248,223,.98), rgba(255,241,201,.92)) !important;\n    border-color:rgba(255,255,255,.58) !important;\n    box-shadow:0 26px 62px rgba(43,23,16,.38), inset 0 0 0 1px rgba(255,255,255,.24) !important;\n  }\n  #honeyLibraryMatch27 .opm-titleMark {\n    position:relative;\n    background:radial-gradient(circle at 50% 46%, #FFF8DF 0 10px, #F4C542 11px 16px, #B87333 17px 23px, rgba(90,50,31,.90) 24px 100%) !important;\n    box-shadow:0 0 24px rgba(244,197,66,.46), 0 10px 24px rgba(63,36,24,.18) !important;\n  }\n  #honeyLibraryMatch27 .opm-titleMark::before,\n  #honeyLibraryMatch27 .opm-titleMark::after {\n    content:\"\";\n    position:absolute;\n    border-radius:999px;\n    background:#FFF1C9;\n    box-shadow:0 0 10px rgba(244,197,66,.90);\n  }\n  #honeyLibraryMatch27 .opm-titleMark::before { width:15px; height:9px; left:11px; top:18px; }\n  #honeyLibraryMatch27 .opm-titleMark::after { width:8px; height:8px; right:13px; top:14px; }\n  #honeyLibraryMatch27 .opm-message { color:#3F2418 !important; }\n  #honeyLibraryMatch27 .opm-small { color:rgba(63,36,24,.78) !important; }\n\n  #honeyLibraryMatch27:fullscreen,\n  #honeyLibraryMatch27.opm-ios-fullscreen { background:#3A2117 !important; }\n\n  @keyframes opmHoneyLibraryBloom {\n    0% { transform:scale(.20) rotate(0deg); opacity:0; }\n    35% { opacity:1; }\n    100% { transform:scale(1.46) rotate(22deg); opacity:0; }\n  }\n<\/style>\n\n<script>\n(function () {\n  \"use strict\";\n\n  const root = document.getElementById(\"honeyLibraryMatch27\");\n  if (!root || root.dataset.hblWpReady === \"1\") return;\n  root.dataset.hblWpReady = \"1\";\n  const boardShell = root.querySelector(\".opm-boardShell\");\n  const boardPad = root.querySelector(\".opm-boardPad\");\n  const boardEl = root.querySelector(\".opm-board\");\n  const linesEl = root.querySelector(\".opm-lines\");\n  const overlay = root.querySelector(\".opm-overlay\");\n  const messageEl = root.querySelector(\".opm-message\");\n  const smallEl = root.querySelector(\".opm-small\");\n  const startBtn = root.querySelector(\".opm-start\");\n  const saveBtn = root.querySelector(\".opm-saveBtn\");\n  const continueBtn = root.querySelector(\".opm-continueBtn\");\n  const hintBtn = root.querySelector(\".opm-hintBtn\");\n  const shuffleBtn = root.querySelector(\".opm-shuffleBtn\");\n  const pauseBtn = root.querySelector(\".opm-pauseBtn\");\n  const muteBtn = root.querySelector(\".opm-soundBtn\");\n  const fullscreenBtn = root.querySelector(\".opm-fullBtn\");\n  const toastEl = root.querySelector(\".opm-toast\");\n\n  const scoreEl = root.querySelector(\".opm-score\");\n  const bestEl = root.querySelector(\".opm-best\");\n  const levelEl = root.querySelector(\".opm-level\");\n  const timeEl = root.querySelector(\".opm-time\");\n  const tilesEl = root.querySelector(\".opm-tiles\");\n  const typesEl = root.querySelector(\".opm-types\");\n  const comboEl = root.querySelector(\".opm-combo\");\n  const timerFill = root.querySelector(\".opm-timerfill\");\n\n  const storageKey = \"honeyLibraryMatch27Best\";\n  const saveStorageKey = \"honeyLibraryMatch27SavedGame\";\n  const maxLevel = 50;\n  const baseTime = 120;\n  const minimumTime = 45;\n  const SFX_VOLUME = 1.32;\n\n  const tileDefs = [\n    { name: \"Honey Jar\", shape: \"honeyjar\", a: \"#F4C542\", b: \"#7A421F\", c: \"#FFF8DF\" },\n    { name: \"Old Book\", shape: \"book\", a: \"#A96A32\", b: \"#4B2A1B\", c: \"#FFF1C9\" },\n    { name: \"Golden Bookmark\", shape: \"bookmark\", a: \"#D9953F\", b: \"#8A4B24\", c: \"#FFF1C9\" },\n    { name: \"Reading Lamp\", shape: \"lamp\", a: \"#FFE08A\", b: \"#9B6426\", c: \"#FFF8DF\" },\n    { name: \"Tea Cup\", shape: \"teacup\", a: \"#FFF1C9\", b: \"#9B6426\", c: \"#F4C542\" },\n    { name: \"Reading Glasses\", shape: \"glasses\", a: \"#C69032\", b: \"#5A321F\", c: \"#FFF8DF\" },\n    { name: \"Honeycomb Page\", shape: \"honeycomb\", a: \"#F6D77D\", b: \"#A76A20\", c: \"#FFF8DF\" },\n    { name: \"Quill Pen\", shape: \"quill\", a: \"#FFF8DF\", b: \"#8F6431\", c: \"#F4C542\" },\n    { name: \"Candle Note\", shape: \"candle\", a: \"#FFE8A6\", b: \"#7A421F\", c: \"#FFF8DF\" },\n    { name: \"Rolled Scroll\", shape: \"scroll\", a: \"#FFF1C9\", b: \"#A96A32\", c: \"#D9953F\" },\n    { name: \"Library Key\", shape: \"key\", a: \"#F4C542\", b: \"#7A421F\", c: \"#FFF8DF\" },\n    { name: \"Ink Bottle\", shape: \"ink\", a: \"#7B4D2A\", b: \"#3A2117\", c: \"#FFF1C9\" },\n    { name: \"Sealed Letter\", shape: \"letter\", a: \"#FFF8DF\", b: \"#9B6426\", c: \"#D9953F\" },\n    { name: \"Tiny Bookshelf\", shape: \"shelf\", a: \"#B87333\", b: \"#5A321F\", c: \"#FFF1C9\" },\n    { name: \"Moon Page\", shape: \"moonpage\", a: \"#FFF1C9\", b: \"#C69032\", c: \"#FFE08A\" },\n    { name: \"Pressed Flower\", shape: \"flower\", a: \"#D9A56B\", b: \"#7B4D2A\", c: \"#FFF1C9\" },\n    { name: \"Pocket Clock\", shape: \"clock\", a: \"#F6D77D\", b: \"#7A421F\", c: \"#FFF8DF\" },\n    { name: \"Shelf Star\", shape: \"star\", a: \"#FFE08A\", b: \"#9B6426\", c: \"#FFF8DF\" },\n    { name: \"Ribbon Book\", shape: \"ribbonbook\", a: \"#B06A38\", b: \"#5A321F\", c: \"#FFF1C9\" },\n    { name: \"Bee Stamp\", shape: \"stamp\", a: \"#FFF1C9\", b: \"#A96A32\", c: \"#F4C542\" },\n    { name: \"Acorn Charm\", shape: \"acorn\", a: \"#C6813E\", b: \"#5A321F\", c: \"#FFE08A\" },\n    { name: \"Golden Leaf\", shape: \"leaf\", a: \"#D2A24A\", b: \"#6F4128\", c: \"#FFF8DF\" },\n    { name: \"Magnifier\", shape: \"magnifier\", a: \"#FFF8DF\", b: \"#7A421F\", c: \"#F4C542\" },\n    { name: \"Wise Owl\", shape: \"owl\", a: \"#A67C52\", b: \"#4B2A1B\", c: \"#FFF1C9\" },\n    { name: \"Book Label\", shape: \"label\", a: \"#FFF1C9\", b: \"#B87333\", c: \"#F4C542\" },\n    { name: \"Open Book\", shape: \"openbook\", a: \"#FFF8DF\", b: \"#9B6426\", c: \"#D9953F\" },\n    { name: \"Little Bee\", shape: \"bee\", a: \"#F4C542\", b: \"#5A321F\", c: \"#FFF8DF\" },\n    { name: \"Notebook\", shape: \"notebook\", a: \"#C69032\", b: \"#5A321F\", c: \"#FFF1C9\" }\n  ];\n\n  function svg(inner) {\n    return '<svg viewBox=\"0 0 64 64\" aria-hidden=\"true\">' + inner + '<\/svg>';\n  }\n\n  function renderIcon(index) {\n    const d = tileDefs[index % tileDefs.length];\n    const shape = d.shape;\n    const a = d.a;\n    const b = d.b;\n    const c = d.c;\n\n    if (shape === \"honeyjar\") {\n      return svg('<rect x=\"20\" y=\"14\" width=\"24\" height=\"7\" rx=\"3\" fill=\"' + b + '\"\/><rect x=\"17\" y=\"20\" width=\"30\" height=\"34\" rx=\"9\" fill=\"' + c + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M19 36c7-5 16 5 26 0v11c-8 4-18 4-26 0z\" fill=\"' + a + '\"\/><path d=\"M24 28h16\" stroke=\"' + b + '\" stroke-width=\"3\" stroke-linecap=\"round\" opacity=\".55\"\/><circle cx=\"27\" cy=\"39\" r=\"3\" fill=\"' + c + '\" opacity=\".58\"\/><circle cx=\"39\" cy=\"44\" r=\"2.5\" fill=\"' + c + '\" opacity=\".55\"\/>');\n    }\n    if (shape === \"book\") {\n      return svg('<rect x=\"17\" y=\"12\" width=\"31\" height=\"42\" rx=\"5\" fill=\"' + a + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M25 12v42\" stroke=\"' + b + '\" stroke-width=\"4\" opacity=\".72\"\/><path d=\"M31 21h11M31 31h10M31 41h8\" stroke=\"' + c + '\" stroke-width=\"3\" stroke-linecap=\"round\"\/><path d=\"M20 50h25\" stroke=\"' + c + '\" stroke-width=\"3\" stroke-linecap=\"round\" opacity=\".65\"\/>');\n    }\n    if (shape === \"bookmark\") {\n      return svg('<path d=\"M23 12h20v40l-10-8-10 8z\" fill=\"' + a + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M29 22h8M29 30h8\" stroke=\"' + c + '\" stroke-width=\"3\" stroke-linecap=\"round\"\/><circle cx=\"33\" cy=\"38\" r=\"3\" fill=\"' + c + '\" opacity=\".72\"\/>');\n    }\n    if (shape === \"lamp\") {\n      return svg('<path d=\"M20 29h24l-5 13H25z\" fill=\"' + a + '\" stroke=\"' + b + '\" stroke-width=\"3\" stroke-linejoin=\"round\"\/><path d=\"M32 42v9M23 52h18\" stroke=\"' + b + '\" stroke-width=\"4\" stroke-linecap=\"round\"\/><path d=\"M24 26c2-9 14-9 16 0\" fill=\"none\" stroke=\"' + c + '\" stroke-width=\"4\" stroke-linecap=\"round\"\/><circle cx=\"32\" cy=\"20\" r=\"6\" fill=\"' + c + '\" opacity=\".32\"\/>');\n    }\n    if (shape === \"teacup\") {\n      return svg('<path d=\"M18 29h27c0 12-5 19-15 19S18 41 18 29z\" fill=\"' + c + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M44 32c8 0 8 11 0 11\" fill=\"none\" stroke=\"' + b + '\" stroke-width=\"4\" stroke-linecap=\"round\"\/><path d=\"M18 50h31\" stroke=\"' + b + '\" stroke-width=\"4\" stroke-linecap=\"round\"\/><path d=\"M25 22c-4-5 4-7 0-11M34 22c-4-5 4-7 0-11\" stroke=\"' + a + '\" stroke-width=\"3\" stroke-linecap=\"round\"\/>');\n    }\n    if (shape === \"glasses\") {\n      return svg('<circle cx=\"24\" cy=\"34\" r=\"10\" fill=\"none\" stroke=\"' + b + '\" stroke-width=\"4\"\/><circle cx=\"42\" cy=\"34\" r=\"10\" fill=\"none\" stroke=\"' + b + '\" stroke-width=\"4\"\/><path d=\"M34 34h-2M14 30l-5-6M52 30l5-6\" stroke=\"' + b + '\" stroke-width=\"4\" stroke-linecap=\"round\"\/><circle cx=\"24\" cy=\"34\" r=\"5\" fill=\"' + c + '\" opacity=\".34\"\/><circle cx=\"42\" cy=\"34\" r=\"5\" fill=\"' + c + '\" opacity=\".34\"\/>');\n    }\n    if (shape === \"honeycomb\") {\n      return svg('<path d=\"M32 12l9 5v10l-9 5-9-5V17z\" fill=\"' + a + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M20 33l8 5v10l-8 5-8-5V38zM44 33l8 5v10l-8 5-8-5V38z\" fill=\"' + a + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M32 32l8 5v10l-8 5-8-5V37z\" fill=\"' + c + '\" opacity=\".42\" stroke=\"' + b + '\" stroke-width=\"2\"\/>');\n    }\n    if (shape === \"quill\") {\n      return svg('<path d=\"M47 11C31 13 18 28 17 47c13-2 29-17 30-36z\" fill=\"' + a + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M43 16L15 49M26 31h13M22 38h10\" stroke=\"' + b + '\" stroke-width=\"3\" stroke-linecap=\"round\"\/><path d=\"M13 51l12-4\" stroke=\"' + c + '\" stroke-width=\"4\" stroke-linecap=\"round\"\/>');\n    }\n    if (shape === \"candle\") {\n      return svg('<rect x=\"25\" y=\"25\" width=\"16\" height=\"27\" rx=\"5\" fill=\"' + c + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M33 11c8 8 3 14 0 16-3-2-7-8 0-16z\" fill=\"' + a + '\" stroke=\"' + b + '\" stroke-width=\"2\"\/><path d=\"M25 35c4 3 9-3 16 0\" fill=\"none\" stroke=\"' + a + '\" stroke-width=\"3\" stroke-linecap=\"round\"\/>');\n    }\n    if (shape === \"scroll\") {\n      return svg('<path d=\"M20 18h28v32H16V22c0-3 2-4 4-4z\" fill=\"' + c + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M20 18c5 0 5 8 0 8h-6c5 0 5-8 0-8zM48 50c-5 0-5-8 0-8h6c-5 0-5 8 0 8z\" fill=\"' + a + '\" stroke=\"' + b + '\" stroke-width=\"2\"\/><path d=\"M25 29h16M25 38h14\" stroke=\"' + b + '\" stroke-width=\"3\" stroke-linecap=\"round\" opacity=\".62\"\/>');\n    }\n    if (shape === \"key\") {\n      return svg('<circle cx=\"24\" cy=\"30\" r=\"9\" fill=\"none\" stroke=\"' + b + '\" stroke-width=\"5\"\/><path d=\"M33 30h21M45 30v8M51 30v6\" stroke=\"' + b + '\" stroke-width=\"5\" stroke-linecap=\"round\"\/><circle cx=\"24\" cy=\"30\" r=\"3\" fill=\"' + c + '\"\/><path d=\"M15 22l8-8\" stroke=\"' + a + '\" stroke-width=\"4\" stroke-linecap=\"round\"\/>');\n    }\n    if (shape === \"ink\") {\n      return svg('<path d=\"M25 14h14l-3 10h-8z\" fill=\"' + b + '\"\/><rect x=\"19\" y=\"23\" width=\"28\" height=\"31\" rx=\"8\" fill=\"' + a + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M25 34h16v11H25z\" fill=\"' + c + '\" opacity=\".72\"\/><path d=\"M29 40h8\" stroke=\"' + b + '\" stroke-width=\"3\" stroke-linecap=\"round\"\/>');\n    }\n    if (shape === \"letter\") {\n      return svg('<rect x=\"13\" y=\"20\" width=\"38\" height=\"28\" rx=\"5\" fill=\"' + c + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M15 22l17 15 17-15M15 46l13-13M49 46L36 33\" fill=\"none\" stroke=\"' + b + '\" stroke-width=\"3\" stroke-linecap=\"round\"\/><circle cx=\"32\" cy=\"37\" r=\"5\" fill=\"' + a + '\"\/>');\n    }\n    if (shape === \"shelf\") {\n      return svg('<rect x=\"14\" y=\"18\" width=\"36\" height=\"34\" rx=\"4\" fill=\"' + a + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M14 29h36M14 41h36\" stroke=\"' + b + '\" stroke-width=\"3\"\/><rect x=\"19\" y=\"21\" width=\"5\" height=\"8\" rx=\"1\" fill=\"' + c + '\"\/><rect x=\"27\" y=\"21\" width=\"7\" height=\"8\" rx=\"1\" fill=\"' + b + '\" opacity=\".7\"\/><rect x=\"38\" y=\"33\" width=\"6\" height=\"8\" rx=\"1\" fill=\"' + c + '\"\/>');\n    }\n    if (shape === \"moonpage\") {\n      return svg('<path d=\"M19 14h31v38H15V18z\" fill=\"' + c + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M41 23c-8 2-12 8-10 15 2 6 9 8 15 5-10 1-16-9-5-20z\" fill=\"' + a + '\"\/><path d=\"M24 29h10M24 39h13\" stroke=\"' + b + '\" stroke-width=\"3\" stroke-linecap=\"round\"\/>');\n    }\n    if (shape === \"flower\") {\n      return svg('<circle cx=\"32\" cy=\"32\" r=\"5\" fill=\"' + b + '\"\/><path d=\"M32 13c8 8 8 14 0 19-8-5-8-11 0-19zM32 51c-8-8-8-14 0-19 8 5 8 11 0 19zM13 32c8-8 14-8 19 0-5 8-11 8-19 0zM51 32c-8 8-14 8-19 0 5-8 11-8 19 0z\" fill=\"' + a + '\" stroke=\"' + b + '\" stroke-width=\"2\"\/><path d=\"M21 45c8-6 14-12 20-24\" stroke=\"' + c + '\" stroke-width=\"3\" stroke-linecap=\"round\"\/>');\n    }\n    if (shape === \"clock\") {\n      return svg('<circle cx=\"32\" cy=\"34\" r=\"18\" fill=\"' + c + '\" stroke=\"' + b + '\" stroke-width=\"4\"\/><path d=\"M32 34V23M32 34l9 5\" stroke=\"' + b + '\" stroke-width=\"4\" stroke-linecap=\"round\"\/><path d=\"M25 14h14M32 14v-5\" stroke=\"' + a + '\" stroke-width=\"4\" stroke-linecap=\"round\"\/><circle cx=\"32\" cy=\"34\" r=\"3\" fill=\"' + a + '\"\/>');\n    }\n    if (shape === \"star\") {\n      return svg('<path d=\"M32 9l6 16 17 1-13 11 4 17-14-9-14 9 4-17L9 26l17-1z\" fill=\"' + a + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M32 23l3 7 8 1-6 5 2 8-7-4-7 4 2-8-6-5 8-1z\" fill=\"' + c + '\" opacity=\".58\"\/>');\n    }\n    if (shape === \"ribbonbook\") {\n      return svg('<rect x=\"18\" y=\"12\" width=\"29\" height=\"42\" rx=\"5\" fill=\"' + a + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M36 13v23l-5-4-5 4V13\" fill=\"' + c + '\" stroke=\"' + b + '\" stroke-width=\"2\"\/><path d=\"M24 44h18\" stroke=\"' + c + '\" stroke-width=\"3\" stroke-linecap=\"round\"\/>');\n    }\n    if (shape === \"stamp\") {\n      return svg('<path d=\"M17 16h30v36H17z\" fill=\"' + c + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M20 20h24v28H20z\" fill=\"none\" stroke=\"' + a + '\" stroke-width=\"2\" stroke-dasharray=\"4 3\"\/><path d=\"M24 34c4-8 12-8 16 0\" fill=\"none\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M24 34h16M28 29v10M36 29v10\" stroke=\"' + b + '\" stroke-width=\"3\" stroke-linecap=\"round\"\/>');\n    }\n    if (shape === \"acorn\") {\n      return svg('<path d=\"M20 28c2 17 22 17 24 0-5 3-19 3-24 0z\" fill=\"' + a + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M18 24c6-10 22-10 28 0-6 7-22 7-28 0z\" fill=\"' + b + '\"\/><path d=\"M32 17c2-4 6-5 9-3\" stroke=\"' + c + '\" stroke-width=\"3\" stroke-linecap=\"round\"\/><path d=\"M25 35h14\" stroke=\"' + c + '\" stroke-width=\"3\" stroke-linecap=\"round\" opacity=\".55\"\/>');\n    }\n    if (shape === \"leaf\") {\n      return svg('<path d=\"M49 15C31 16 17 27 16 48c19-1 32-15 33-33z\" fill=\"' + a + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M45 19L16 48M28 35h-9M35 28h-10\" stroke=\"' + c + '\" stroke-width=\"3\" stroke-linecap=\"round\"\/>');\n    }\n    if (shape === \"magnifier\") {\n      return svg('<circle cx=\"28\" cy=\"28\" r=\"14\" fill=\"' + c + '\" opacity=\".62\" stroke=\"' + b + '\" stroke-width=\"4\"\/><path d=\"M39 39l13 13\" stroke=\"' + b + '\" stroke-width=\"6\" stroke-linecap=\"round\"\/><path d=\"M22 25c3-5 8-7 13-4\" stroke=\"' + a + '\" stroke-width=\"3\" stroke-linecap=\"round\"\/>');\n    }\n    if (shape === \"owl\") {\n      return svg('<path d=\"M18 24c0-10 28-10 28 0v18c0 10-28 10-28 0z\" fill=\"' + a + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><circle cx=\"26\" cy=\"31\" r=\"7\" fill=\"' + c + '\"\/><circle cx=\"38\" cy=\"31\" r=\"7\" fill=\"' + c + '\"\/><circle cx=\"26\" cy=\"31\" r=\"2.8\" fill=\"' + b + '\"\/><circle cx=\"38\" cy=\"31\" r=\"2.8\" fill=\"' + b + '\"\/><path d=\"M32 36l-4 6h8zM22 21l-5-7M42 21l5-7\" fill=\"' + b + '\" stroke=\"' + b + '\" stroke-linecap=\"round\"\/>');\n    }\n    if (shape === \"label\") {\n      return svg('<path d=\"M16 18h32v28c-10 7-22 7-32 0z\" fill=\"' + c + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M23 27h18M24 36h16\" stroke=\"' + b + '\" stroke-width=\"3\" stroke-linecap=\"round\"\/><circle cx=\"32\" cy=\"48\" r=\"5\" fill=\"' + a + '\"\/>');\n    }\n    if (shape === \"openbook\") {\n      return svg('<path d=\"M11 18c9-5 15-4 21 2v35c-6-5-13-6-21-2z\" fill=\"' + c + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M53 18c-9-5-15-4-21 2v35c6-5 13-6 21-2z\" fill=\"' + c + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M21 28h7M21 37h7M36 28h8M36 37h8\" stroke=\"' + a + '\" stroke-width=\"3\" stroke-linecap=\"round\"\/>');\n    }\n    if (shape === \"bee\") {\n      return svg('<ellipse cx=\"32\" cy=\"34\" rx=\"13\" ry=\"10\" fill=\"' + a + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M26 26c-8-9-16 1-10 8M38 26c8-9 16 1 10 8\" fill=\"none\" stroke=\"' + c + '\" stroke-width=\"4\" stroke-linecap=\"round\" opacity=\".78\"\/><path d=\"M27 27v14M33 25v18M39 28v12\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M45 34h8M11 34h8\" stroke=\"' + b + '\" stroke-width=\"3\" stroke-linecap=\"round\"\/>');\n    }\n    return svg('<rect x=\"18\" y=\"12\" width=\"30\" height=\"43\" rx=\"6\" fill=\"' + a + '\" stroke=\"' + b + '\" stroke-width=\"3\"\/><path d=\"M24 12v43\" stroke=\"' + b + '\" stroke-width=\"4\" opacity=\".70\"\/><path d=\"M30 22h12M30 32h10M30 42h12\" stroke=\"' + c + '\" stroke-width=\"3\" stroke-linecap=\"round\"\/><circle cx=\"24\" cy=\"20\" r=\"2.5\" fill=\"' + c + '\"\/>');\n  }\n\n  function getSavedBest() {\n    try {\n      return Number(localStorage.getItem(storageKey) || 0);\n    } catch (e) {\n      return 0;\n    }\n  }\n\n  function setSavedBest(value) {\n    try {\n      localStorage.setItem(storageKey, String(value));\n    } catch (e) {}\n  }\n\n  let state = {\n    board: [],\n    maxRows: 8,\n    maxCols: 18,\n    activeRows: 4,\n    activeCols: 8,\n    level: 1,\n    score: 0,\n    best: getSavedBest(),\n    time: 0,\n    maxTime: 0,\n    combo: 0,\n    itemCount: 6,\n    totalTiles: 32,\n    hintCost: 10,\n    shuffleCost: 20,\n    matchTimeBonus: 2,\n    selected: null,\n    locked: false,\n    playing: false,\n    paused: false,\n    timer: null,\n    overlayMode: \"start\",\n    cell: 0,\n    tileSize: 0,\n    padW: 0,\n    padH: 0,\n    muted: false,\n    audio: null,\n    toastTimer: null\n  };\n\n  bestEl.textContent = state.best;\n\n  function initAudio() {\n    if (state.audio || state.muted) return;\n    const AudioContext = window.AudioContext || window.webkitAudioContext;\n    if (!AudioContext) return;\n    state.audio = new AudioContext();\n  }\n\n  function tone(freq, duration, type, gainValue, delay, slide) {\n    if (!state.audio || state.muted) return;\n\n    const ctx = state.audio;\n    const now = ctx.currentTime + (delay || 0);\n    const osc = ctx.createOscillator();\n    const gain = ctx.createGain();\n\n    osc.type = type || \"sine\";\n    osc.frequency.setValueAtTime(freq, now);\n\n    if (slide) {\n      osc.frequency.exponentialRampToValueAtTime(Math.max(30, freq * slide), now + duration);\n    }\n\n    gain.gain.setValueAtTime(0.0001, now);\n    gain.gain.exponentialRampToValueAtTime(Math.min(0.11, (gainValue || 0.07) * SFX_VOLUME), now + 0.012);\n    gain.gain.exponentialRampToValueAtTime(0.0001, now + duration);\n\n    osc.connect(gain);\n    gain.connect(ctx.destination);\n    osc.start(now);\n    osc.stop(now + duration + 0.04);\n  }\n\n  function sound(type) {\n    if (state.muted) return;\n    initAudio();\n    if (!state.audio) return;\n\n    if (state.audio.state === \"suspended\") {\n      state.audio.resume();\n    }\n\n    if (type === \"tap\") {\n      tone(360, 0.036, \"triangle\", 0.046, 0, 1.04);\n      tone(560, 0.034, \"sine\", 0.020, 0.018, 1.02);\n    } else if (type === \"match\") {\n      tone(480, 0.065, \"triangle\", 0.054, 0, 1.13);\n      tone(720, 0.092, \"sine\", 0.046, 0.050, 1.12);\n      tone(1040, 0.120, \"sine\", 0.032, 0.116, 1.07);\n    } else if (type === \"wrong\") {\n      tone(190, 0.110, \"triangle\", 0.050, 0, 0.78);\n      tone(135, 0.120, \"sine\", 0.026, 0.060, 0.84);\n    } else if (type === \"shuffle\") {\n      tone(240, 0.055, \"triangle\", 0.038, 0, 1.14);\n      tone(390, 0.070, \"triangle\", 0.040, 0.054, 1.18);\n      tone(680, 0.120, \"sine\", 0.034, 0.128, 1.08);\n    } else if (type === \"pause\") {\n      tone(300, 0.092, \"sine\", 0.038, 0, 0.90);\n      tone(230, 0.105, \"triangle\", 0.022, 0.064, 0.94);\n    } else if (type === \"win\") {\n      tone(500, 0.085, \"triangle\", 0.050, 0, 1.14);\n      tone(690, 0.110, \"sine\", 0.046, 0.070, 1.15);\n      tone(920, 0.145, \"sine\", 0.036, 0.158, 1.08);\n    } else if (type === \"finish\") {\n      tone(480, 0.100, \"triangle\", 0.054, 0, 1.15);\n      tone(660, 0.126, \"sine\", 0.048, 0.090, 1.16);\n      tone(900, 0.170, \"sine\", 0.042, 0.190, 1.14);\n      tone(1160, 0.230, \"sine\", 0.032, 0.310, 1.07);\n    } else if (type === \"lose\") {\n      tone(210, 0.170, \"triangle\", 0.050, 0, 0.78);\n      tone(150, 0.210, \"sine\", 0.034, 0.135, 0.84);\n    }\n  }\n\n  function shuffleArray(arr) {\n    for (let i = arr.length - 1; i > 0; i--) {\n      const j = Math.floor(Math.random() * (i + 1));\n      const temp = arr[i];\n      arr[i] = arr[j];\n      arr[j] = temp;\n    }\n    return arr;\n  }\n\n  function getShapeForLevel(level) {\n    if (level <= 5) return { cols: 8, rows: 4 };\n    if (level <= 10) return { cols: 10, rows: 4 };\n    if (level <= 15) return { cols: 10, rows: 6 };\n    if (level <= 20) return { cols: 12, rows: 6 };\n    if (level <= 25) return { cols: 14, rows: 6 };\n    if (level <= 32) return { cols: 14, rows: 8 };\n    if (level <= 40) return { cols: 16, rows: 8 };\n    return { cols: 18, rows: 8 };\n  }\n\n  function getLateGameDifficulty(level) {\n    return {\n      shufflePasses: 2 + Math.floor(level \/ 8),\n      antiEasyPasses: level >= 13 ? Math.min(14, 1 + Math.floor((level - 13) \/ 3)) : 0,\n      timeCut: level >= 13 ? Math.floor((level - 12) * 0.75) : 0\n    };\n  }\n\n  function applyDifficulty() {\n    const shape = getShapeForLevel(state.level);\n    const late = getLateGameDifficulty(state.level);\n\n    state.activeRows = shape.rows;\n    state.activeCols = shape.cols;\n    state.totalTiles = state.activeRows * state.activeCols;\n    state.itemCount = Math.min(tileDefs.length, 6 + Math.floor((state.level - 1) * 26 \/ (maxLevel - 1)));\n\n    state.maxTime = Math.max(\n      minimumTime,\n      Math.round(baseTime + state.totalTiles * 1.42 - state.level * 0.95 - late.timeCut)\n    );\n\n    state.hintCost = 10;\n    state.shuffleCost = 20;\n    state.matchTimeBonus = 2;\n  }\n\n  function resetBoardArray() {\n    state.board = [];\n\n    for (let r = 0; r < state.maxRows; r++) {\n      const row = [];\n      for (let c = 0; c < state.maxCols; c++) {\n        row.push(null);\n      }\n      state.board.push(row);\n    }\n  }\n\n  function getActiveCells() {\n    const cells = [];\n    const rowStart = Math.floor((state.maxRows - state.activeRows) \/ 2);\n    const colStart = Math.floor((state.maxCols - state.activeCols) \/ 2);\n\n    for (let r = rowStart; r < rowStart + state.activeRows; r++) {\n      for (let c = colStart; c < colStart + state.activeCols; c++) {\n        cells.push({ r: r, c: c });\n      }\n    }\n\n    return cells;\n  }\n\n  function getOccupiedCells() {\n    const cells = [];\n\n    for (let r = 0; r < state.maxRows; r++) {\n      for (let c = 0; c < state.maxCols; c++) {\n        if (state.board[r][c] !== null) {\n          cells.push({ r: r, c: c });\n        }\n      }\n    }\n\n    return cells;\n  }\n\n  function buildLevel() {\n    applyDifficulty();\n    resetBoardArray();\n\n    const activeCells = getActiveCells();\n    const pairCount = activeCells.length \/ 2;\n    const actualItemCount = Math.min(state.itemCount, pairCount);\n    const pool = [];\n\n    for (let i = 0; i < pairCount; i++) {\n      const iconIndex = i % actualItemCount;\n      pool.push(iconIndex, iconIndex);\n    }\n\n    shuffleArray(pool);\n    shuffleArray(activeCells);\n\n    for (let i = 0; i < activeCells.length; i++) {\n      const cell = activeCells[i];\n      state.board[cell.r][cell.c] = pool[i];\n    }\n\n    state.time = state.maxTime;\n    state.combo = 0;\n    state.selected = null;\n    state.locked = false;\n    root.classList.remove(\"opm-matching\");\n    state.playing = true;\n    state.paused = false;\n\n    deepShuffleBoardForLevel();\n    renderBoard();\n    updatePanel();\n    startTimer();\n    setButtons(true);\n    setPauseVisual(false);\n  }\n\n  function deepShuffleBoardForLevel() {\n    const late = getLateGameDifficulty(state.level);\n\n    for (let i = 0; i < late.shufflePasses; i++) {\n      reshuffleValuesOnly();\n    }\n\n    for (let i = 0; i < late.antiEasyPasses; i++) {\n      reduceEasyClusters();\n    }\n\n    makePlayable();\n  }\n\n  function reduceEasyClusters() {\n    const cells = getOccupiedCells();\n    shuffleArray(cells);\n\n    for (let i = 0; i < cells.length; i++) {\n      const a = cells[i];\n      const value = state.board[a.r][a.c];\n\n      const neighbors = [\n        { r: a.r - 1, c: a.c },\n        { r: a.r + 1, c: a.c },\n        { r: a.r, c: a.c - 1 },\n        { r: a.r, c: a.c + 1 }\n      ];\n\n      let hasEasyNeighbor = false;\n\n      for (let n = 0; n < neighbors.length; n++) {\n        const b = neighbors[n];\n\n        \/\/ WP-safe equivalent of a short-circuited bounds and equality check.\n        if (!(b.r < 0 || b.c < 0 || b.r >= state.maxRows ||\n              b.c >= state.maxCols || state.board[b.r][b.c] !== value)) {\n          hasEasyNeighbor = true;\n          break;\n        }\n      }\n\n      if (!hasEasyNeighbor) continue;\n\n      const swap = cells[Math.floor(Math.random() * cells.length)];\n      if (!swap || state.board[swap.r][swap.c] === value) continue;\n\n      const temp = state.board[a.r][a.c];\n      state.board[a.r][a.c] = state.board[swap.r][swap.c];\n      state.board[swap.r][swap.c] = temp;\n    }\n  }\n\n  function renderBoard() {\n    boardEl.innerHTML = \"\";\n\n    for (let r = 0; r < state.maxRows; r++) {\n      for (let c = 0; c < state.maxCols; c++) {\n        const value = state.board[r][c];\n        if (value === null) continue;\n\n        const tile = document.createElement(\"button\");\n        tile.type = \"button\";\n        tile.className = \"opm-tile\";\n        tile.dataset.r = r;\n        tile.dataset.c = c;\n        tile.setAttribute(\"role\", \"gridcell\");\n        tile.setAttribute(\"aria-label\", tileDefs[value].name || \"Tailor tile\");\n        tile.innerHTML = renderIcon(value);\n        tile.addEventListener(\"click\", onTileClick);\n        boardEl.appendChild(tile);\n      }\n    }\n\n    resizeBoard();\n  }\n\n  function getCssNumber(name, fallback) {\n    const raw = getComputedStyle(root).getPropertyValue(name).trim();\n    const n = parseFloat(raw);\n    return Number.isFinite(n) ? n : fallback;\n  }\n\n  function resizeBoard() {\n    updateLandscapeTransform();\n\n    const shellW = boardShell.clientWidth;\n    const shellH = boardShell.clientHeight;\n\n    if (!shellW || !shellH) return;\n\n    const fullscreen = isFullscreenActive();\n    const gridScale = fullscreen ? getCssNumber(\"--ebm-fullscreen-grid-scale\", 0.92) : 1;\n    const tileFill = getCssNumber(\"--ebm-tile-fill\", 0.88);\n\n    const sideBreathingRoom = fullscreen\n      ? Math.max(34, Math.min(86, shellW * 0.038))\n      : 2;\n    const verticalBreathingRoom = fullscreen\n      ? Math.max(46, Math.min(104, shellH * 0.085))\n      : Math.max(20, Math.min(34, shellH * 0.065));\n\n    const availW = Math.max(120, shellW - sideBreathingRoom);\n    const availH = Math.max(120, shellH - verticalBreathingRoom);\n\n    const widthCell = Math.floor(availW \/ (state.maxCols + 1));\n    const heightCell = Math.floor(availH \/ (state.maxRows + 1));\n\n    \/* Keep cells square in fullscreen too.\n       The previous fullscreen version stretched cellX wider than cellY,\n       which made the tile gaps look too wide. *\/\n    let cell = Math.floor(Math.min(widthCell, heightCell) * gridScale);\n    cell = Math.max(14, cell);\n\n    state.cell = cell;\n    state.cellX = cell;\n    state.cellY = cell;\n\n    let tileSize = Math.floor(cell * tileFill);\n    tileSize = Math.max(26, Math.min(tileSize, cell - 2));\n\n    state.tileSize = tileSize;\n    state.padW = cell * (state.maxCols + 1);\n    state.padH = cell * (state.maxRows + 1);\n\n    boardPad.style.width = state.padW + \"px\";\n    boardPad.style.height = state.padH + \"px\";\n    boardEl.style.width = state.padW + \"px\";\n    boardEl.style.height = state.padH + \"px\";\n\n    linesEl.setAttribute(\"viewBox\", \"0 0 \" + state.padW + \" \" + state.padH);\n    linesEl.style.width = state.padW + \"px\";\n    linesEl.style.height = state.padH + \"px\";\n\n    positionTiles();\n  }\n\n  function positionTiles() {\n    const tiles = boardEl.querySelectorAll(\".opm-tile\");\n\n    tiles.forEach(function (tile) {\n      const r = Number(tile.dataset.r);\n      const c = Number(tile.dataset.c);\n      const size = state.tileSize;\n      const cellX = state.cellX || state.cell;\n      const cellY = state.cellY || state.cell;\n      const centerX = (c + 0.5) * cellX;\n      const centerY = (r + 0.5) * cellY;\n\n      tile.style.width = size + \"px\";\n      tile.style.height = size + \"px\";\n      tile.style.left = (centerX - size \/ 2) + \"px\";\n      tile.style.top = (centerY - size \/ 2) + \"px\";\n    });\n  }\n\n  function getTileEl(r, c) {\n    return boardEl.querySelector('[data-r=\"' + r + '\"][data-c=\"' + c + '\"]');\n  }\n\n  function onTileClick(e) {\n    if (!state.playing || state.paused || state.locked) return;\n\n    initAudio();\n\n    const tile = e.currentTarget;\n    const r = Number(tile.dataset.r);\n    const c = Number(tile.dataset.c);\n    const value = state.board[r][c];\n\n    if (value === null) return;\n\n    clearHintStyles();\n\n    if (!state.selected) {\n      selectTile(r, c);\n      sound(\"tap\");\n      return;\n    }\n\n    if (state.selected.r === r ? state.selected.c === c : false) {\n      clearSelection();\n      sound(\"tap\");\n      return;\n    }\n\n    const first = state.selected;\n    const firstValue = state.board[first.r][first.c];\n\n    if (firstValue !== value) {\n      markWrong(first.r, first.c);\n      selectTile(r, c);\n      state.combo = 0;\n      updatePanel();\n      sound(\"wrong\");\n      return;\n    }\n\n    const path = findPath(first, { r: r, c: c });\n\n    if (!path) {\n      markWrong(first.r, first.c);\n      markWrong(r, c);\n      state.combo = 0;\n      updatePanel();\n      sound(\"wrong\");\n      return;\n    }\n\n    connectTiles(first, { r: r, c: c }, path);\n  }\n\n  function selectTile(r, c) {\n    clearSelection();\n    state.selected = { r: r, c: c };\n\n    const tile = getTileEl(r, c);\n    if (tile) {\n      tile.classList.add(\"opm-selected\");\n    }\n  }\n\n  function clearSelection() {\n    boardEl.querySelectorAll(\".opm-selected\").forEach(function (el) {\n      el.classList.remove(\"opm-selected\");\n    });\n\n    state.selected = null;\n  }\n\n  function markWrong(r, c) {\n    const tile = getTileEl(r, c);\n    if (!tile) return;\n\n    tile.classList.remove(\"opm-wrong\");\n    void tile.offsetWidth;\n    tile.classList.add(\"opm-wrong\");\n\n    setTimeout(function () {\n      tile.classList.remove(\"opm-wrong\");\n    }, 280);\n  }\n\n  function connectTiles(a, b, path) {\n    state.locked = true;\n    root.classList.add(\"opm-matching\");\n\n    const tileA = getTileEl(a.r, a.c);\n    const tileB = getTileEl(b.r, b.c);\n\n    if (tileA) {\n      tileA.classList.add(\"opm-match\");\n      createThreadBloom(tileA);\n    }\n\n    if (tileB) {\n      tileB.classList.add(\"opm-match\");\n      createThreadBloom(tileB);\n    }\n\n    drawPath(path, false);\n    sound(\"match\");\n\n    setTimeout(function () {\n      state.board[a.r][a.c] = null;\n      state.board[b.r][b.c] = null;\n\n      state.combo += 1;\n\n      const comboBonus = Math.min(180, state.combo * 10);\n      const levelBonus = Math.min(220, state.level * 6);\n\n      state.score += 50 + comboBonus + levelBonus;\n\n      if (state.matchTimeBonus > 0) {\n        state.time = Math.min(state.maxTime, state.time + state.matchTimeBonus);\n      }\n\n      clearLine();\n      clearSelection();\n      renderBoard();\n      updatePanel();\n      root.classList.remove(\"opm-matching\");\n\n      state.locked = false;\n\n      if (isBoardClear()) {\n        levelClear();\n      } else if (!findFirstMove()) {\n        showShuffleNeededPopup();\n      }\n    }, 390);\n  }\n\n  function isBoardClear() {\n    for (let r = 0; r < state.board.length; r++) {\n      for (let c = 0; c < state.board[r].length; c++) {\n        if (state.board[r][c] !== null) return false;\n      }\n    }\n\n    return true;\n  }\n\n  function countRemainingTiles() {\n    let count = 0;\n\n    for (let r = 0; r < state.board.length; r++) {\n      for (let c = 0; c < state.board[r].length; c++) {\n        if (state.board[r][c] !== null) count++;\n      }\n    }\n\n    return count;\n  }\n\n  function startTimer() {\n    clearInterval(state.timer);\n\n    state.timer = setInterval(function () {\n      if (!state.playing || state.paused) return;\n\n      state.time -= 1;\n\n      if (state.time <= 0) {\n        state.time = 0;\n        updatePanel();\n        gameOver();\n        return;\n      }\n\n      updatePanel();\n    }, 1000);\n  }\n\n  function updatePanel() {\n    scoreEl.textContent = state.score;\n    bestEl.textContent = Math.max(state.best, state.score);\n    levelEl.textContent = state.level + \"\/\" + maxLevel;\n    timeEl.textContent = state.time;\n    tilesEl.textContent = countRemainingTiles();\n    typesEl.textContent = state.itemCount;\n    comboEl.textContent = state.combo;\n\n    const pct = state.maxTime ? Math.max(0, Math.min(100, (state.time \/ state.maxTime) * 100)) : 0;\n    timerFill.style.width = pct + \"%\";\n\n    hintBtn.textContent = \"Hint -\" + state.hintCost + \"s\";\n    shuffleBtn.textContent = \"Shuffle -\" + state.shuffleCost + \"s\";\n  }\n\n  function spendTimePenalty(seconds) {\n    state.time = Math.max(0, state.time - seconds);\n    updatePanel();\n\n    if (state.time <= 0) {\n      gameOver();\n      return false;\n    }\n\n    return true;\n  }\n\n  function saveBest() {\n    if (state.score > state.best) {\n      state.best = state.score;\n      setSavedBest(state.best);\n    }\n\n    bestEl.textContent = state.best;\n  }\n\n\n  function cloneBoard(board) {\n    return board.map(function (row) {\n      return Array.isArray(row) ? row.slice() : [];\n    });\n  }\n\n  function normalizeSavedGame(raw) {\n    if (!raw || !Array.isArray(raw.board)) return null;\n\n    const maxRows = Number(raw.maxRows);\n    const maxCols = Number(raw.maxCols);\n    const activeRows = Number(raw.activeRows);\n    const activeCols = Number(raw.activeCols);\n\n    if (!Number.isFinite(maxRows) || !Number.isFinite(maxCols)) return null;\n    if (maxRows < 1 || maxCols < 1 || maxRows > 12 || maxCols > 22) return null;\n    if (raw.board.length !== maxRows) return null;\n\n    const cleanBoard = [];\n\n    for (let r = 0; r < maxRows; r++) {\n      if (!Array.isArray(raw.board[r]) || raw.board[r].length !== maxCols) return null;\n\n      const cleanRow = [];\n\n      for (let c = 0; c < maxCols; c++) {\n        const value = raw.board[r][c];\n\n        if (value === null) {\n          cleanRow.push(null);\n        } else {\n          const n = Number(value);\n          if (!Number.isInteger(n) || n < 0 || n >= tileDefs.length) return null;\n          cleanRow.push(n);\n        }\n      }\n\n      cleanBoard.push(cleanRow);\n    }\n\n    return {\n      version: Number(raw.version) || 1,\n      savedAt: Number(raw.savedAt) || Date.now(),\n      board: cleanBoard,\n      maxRows: maxRows,\n      maxCols: maxCols,\n      activeRows: Number.isFinite(activeRows) ? activeRows : 4,\n      activeCols: Number.isFinite(activeCols) ? activeCols : 8,\n      level: Math.max(1, Math.min(maxLevel, Number(raw.level) || 1)),\n      score: Math.max(0, Number(raw.score) || 0),\n      best: Math.max(0, Number(raw.best) || 0),\n      time: Math.max(1, Number(raw.time) || minimumTime),\n      maxTime: Math.max(1, Number(raw.maxTime) || Number(raw.time) || minimumTime),\n      combo: Math.max(0, Number(raw.combo) || 0),\n      itemCount: Math.max(1, Math.min(tileDefs.length, Number(raw.itemCount) || 6)),\n      totalTiles: Math.max(0, Number(raw.totalTiles) || 0),\n      hintCost: Math.max(0, Number(raw.hintCost) || 10),\n      shuffleCost: Math.max(0, Number(raw.shuffleCost) || 20),\n      matchTimeBonus: Math.max(0, Number(raw.matchTimeBonus) || 2)\n    };\n  }\n\n  function readSavedGame() {\n    try {\n      return normalizeSavedGame(JSON.parse(localStorage.getItem(saveStorageKey) || \"null\"));\n    } catch (e) {\n      return null;\n    }\n  }\n\n  function hasSavedGame() {\n    return !!readSavedGame();\n  }\n\n  function clearSavedGame() {\n    try {\n      localStorage.removeItem(saveStorageKey);\n    } catch (e) {}\n    updateOverlayButtons();\n  }\n\n  function createSaveSnapshot() {\n    return {\n      version: 2,\n      savedAt: Date.now(),\n      board: cloneBoard(state.board),\n      maxRows: state.maxRows,\n      maxCols: state.maxCols,\n      activeRows: state.activeRows,\n      activeCols: state.activeCols,\n      level: state.level,\n      score: state.score,\n      best: Math.max(state.best, state.score),\n      time: state.time,\n      maxTime: state.maxTime,\n      combo: state.combo,\n      itemCount: state.itemCount,\n      totalTiles: countRemainingTiles(),\n      hintCost: state.hintCost,\n      shuffleCost: state.shuffleCost,\n      matchTimeBonus: state.matchTimeBonus\n    };\n  }\n\n  function updateOverlayButtons() {\n    if (!saveBtn || !continueBtn) return;\n\n    saveBtn.hidden = state.overlayMode !== \"pause\" || !state.playing || !state.paused;\n    continueBtn.hidden = state.overlayMode !== \"start\" || !hasSavedGame();\n  }\n\n  function saveCurrentGame() {\n    if (!state.playing || !state.paused) return;\n\n    try {\n      localStorage.setItem(saveStorageKey, JSON.stringify(createSaveSnapshot()));\n    } catch (e) {\n      showToast(\"The honey library could not save this shelf.\");\n      sound(\"wrong\");\n      return;\n    }\n\n    clearInterval(state.timer);\n    saveBest();\n    state.playing = false;\n    state.paused = false;\n    state.locked = false;\n    state.selected = null;\n    clearSelection();\n    clearHintStyles();\n    clearLine();\n    setButtons(false);\n    setPauseVisual(false);\n    state.overlayMode = \"start\";\n    messageEl.textContent = \"Honey Library Match\";\n    smallEl.textContent = \"Your honey library shelf has been saved. Continue it when the reading light calls you back, or open a fresh shelf.\";\n    startBtn.textContent = \"Open the Library\";\n    updateOverlayButtons();\n    overlay.classList.remove(\"opm-hidden\");\n    updatePanel();\n    sound(\"tap\");\n  }\n\n  function loadSavedGame() {\n    const saved = readSavedGame();\n\n    if (!saved) {\n      clearSavedGame();\n      showToast(\"No saved library shelf was found.\");\n      sound(\"wrong\");\n      return;\n    }\n\n    clearInterval(state.timer);\n    root.classList.remove(\"opm-matching\");\n    state.board = cloneBoard(saved.board);\n    state.maxRows = saved.maxRows;\n    state.maxCols = saved.maxCols;\n    state.activeRows = saved.activeRows;\n    state.activeCols = saved.activeCols;\n    state.level = saved.level;\n    state.score = saved.score;\n    state.best = Math.max(getSavedBest(), saved.best, saved.score);\n    state.time = saved.time;\n    state.maxTime = Math.max(saved.time, saved.maxTime);\n    state.combo = saved.combo;\n    state.itemCount = saved.itemCount;\n    state.totalTiles = saved.totalTiles || countRemainingTiles();\n    state.hintCost = saved.hintCost;\n    state.shuffleCost = saved.shuffleCost;\n    state.matchTimeBonus = saved.matchTimeBonus;\n    state.selected = null;\n    state.locked = false;\n    state.playing = true;\n    state.paused = false;\n    state.overlayMode = \"playing\";\n\n    if (state.best > getSavedBest()) {\n      setSavedBest(state.best);\n    }\n\n    clearSelection();\n    clearHintStyles();\n    clearLine();\n    overlay.classList.add(\"opm-hidden\");\n    updateOverlayButtons();\n    renderBoard();\n    updatePanel();\n    setButtons(true);\n    setPauseVisual(false);\n    startTimer();\n    showToast(\"The saved library shelf returns to the honeylight.\");\n    sound(\"tap\");\n\n    if (!isBoardClear() ? !findFirstMove() : false) {\n      setTimeout(showShuffleNeededPopup, 220);\n    }\n  }\n\n  function createThreadBloom(tile) {\n    if (!tile) return;\n\n    const fx = document.createElement(\"span\");\n    fx.className = \"opm-threadFx\";\n    tile.appendChild(fx);\n\n    setTimeout(function () {\n      if (fx.parentNode) {\n        fx.parentNode.removeChild(fx);\n      }\n    }, 520);\n  }\n\n  function setPauseVisual(isPaused) {\n    pauseBtn.classList.toggle(\"opm-isPaused\", !!isPaused);\n    pauseBtn.setAttribute(\"aria-label\", isPaused ? \"Resume\" : \"Pause\");\n\n    if (!pauseBtn.querySelector(\".opm-pauseIcon\")) {\n      pauseBtn.innerHTML = '<span class=\"opm-pauseIcon\" aria-hidden=\"true\"><\/span>';\n    }\n  }\n\n  function setButtons(enabled) {\n    hintBtn.disabled = !enabled;\n    shuffleBtn.disabled = !enabled;\n    pauseBtn.disabled = !state.playing;\n  }\n\n  function pauseGame() {\n    if (!state.playing || state.paused) return;\n\n    state.paused = true;\n    clearLine();\n    clearSelection();\n    clearHintStyles();\n\n    hintBtn.disabled = true;\n    shuffleBtn.disabled = true;\n    setPauseVisual(true);\n\n    state.overlayMode = \"pause\";\n    messageEl.textContent = \"The Honey Shelf Rests Quietly\";\n    smallEl.textContent = \"The golden shelves wait softly in the reading room. Take a breath, then return when you are ready.\";\n    startBtn.textContent = \"Return to the Library\";\n    updateOverlayButtons();\n    overlay.classList.remove(\"opm-hidden\");\n\n    sound(\"pause\");\n  }\n\n  function resumeGame() {\n    if (!state.playing || !state.paused || state.overlayMode !== \"pause\") return;\n\n    state.paused = false;\n    state.overlayMode = \"playing\";\n    updateOverlayButtons();\n    overlay.classList.add(\"opm-hidden\");\n    hintBtn.disabled = false;\n    shuffleBtn.disabled = false;\n    setPauseVisual(false);\n    sound(\"tap\");\n  }\n\n\n  function showShuffleNeededPopup() {\n    if (!state.playing || state.paused || isBoardClear()) return;\n\n    state.paused = true;\n    state.locked = true;\n    clearSelection();\n    clearHintStyles();\n    clearLine();\n    hintBtn.disabled = true;\n    shuffleBtn.disabled = true;\n    pauseBtn.disabled = true;\n    setPauseVisual(true);\n\n    state.overlayMode = \"shuffleNeeded\";\n    messageEl.textContent = \"No Golden Path Remains\";\n    smallEl.textContent = \"The honey shelf has no matching path left. Refresh the shelf to keep the golden reading light moving.\";\n    startBtn.textContent = \"Refresh the Shelf -\" + state.shuffleCost + \"s\";\n    updateOverlayButtons();\n    overlay.classList.remove(\"opm-hidden\");\n    sound(\"wrong\");\n  }\n\n  function resolveShuffleNeeded() {\n    if (!state.playing || state.overlayMode !== \"shuffleNeeded\") return;\n\n    state.paused = false;\n    state.locked = false;\n    state.overlayMode = \"playing\";\n    updateOverlayButtons();\n    overlay.classList.add(\"opm-hidden\");\n    setPauseVisual(false);\n\n    if (!spendTimePenalty(state.shuffleCost)) return;\n\n    shuffleRemaining();\n    hintBtn.disabled = false;\n    shuffleBtn.disabled = false;\n    pauseBtn.disabled = false;\n  }\n\n  function levelClear() {\n    state.playing = false;\n    state.paused = false;\n    clearInterval(state.timer);\n    saveBest();\n    setButtons(false);\n    setPauseVisual(false);\n\n    if (state.level >= maxLevel) {\n      sound(\"finish\");\n      state.overlayMode = \"finished\";\n      messageEl.textContent = \"Every Page Has Found Its Shelf\";\n      smallEl.textContent = \"You cleared all 50 honey shelves and kept the library glowing until dawn. Final score: \" + state.score + \".\";\n      startBtn.textContent = \"Play Again\";\n      updateOverlayButtons();\n      clearSavedGame();\n      overlay.classList.remove(\"opm-hidden\");\n      return;\n    }\n\n    sound(\"win\");\n    state.overlayMode = \"next\";\n    messageEl.textContent = \"A Fresh Shelf Is Ready\";\n    smallEl.textContent = state.level >= 40\n      ? \"The reading shelf is almost full. Let the honeylight guide your next pair.\"\n      : state.level >= 13\n        ? \"The next shelf is fuller, brighter, and a little trickier to clear.\"\n        : \"The library shelf is stretching wider. More golden little treasures are drifting in.\";\n    startBtn.textContent = \"Open the Next Shelf\";\n    updateOverlayButtons();\n    overlay.classList.remove(\"opm-hidden\");\n  }\n\n  function gameOver() {\n    state.playing = false;\n    state.paused = false;\n    clearInterval(state.timer);\n    saveBest();\n    setButtons(false);\n    setPauseVisual(false);\n    sound(\"lose\");\n\n    state.overlayMode = \"restart\";\n    messageEl.textContent = \"The Honeylight Has Faded\";\n    smallEl.textContent = \"The reading light faded before every match could be cleared. Final score: \" + state.score + \". Follow the honeylight and try again.\";\n    startBtn.textContent = \"Try Again\";\n    updateOverlayButtons();\n    clearSavedGame();\n    overlay.classList.remove(\"opm-hidden\");\n  }\n\n  function startFreshGame() {\n    clearSavedGame();\n    state.level = 1;\n    state.score = 0;\n    state.combo = 0;\n    state.overlayMode = \"playing\";\n    updateOverlayButtons();\n    overlay.classList.add(\"opm-hidden\");\n    buildLevel();\n    showToast(\"Find matching library treasures. Hint and Shuffle cost time.\");\n  }\n\n  function nextLevel() {\n    state.level += 1;\n    state.combo = 0;\n    state.overlayMode = \"playing\";\n    updateOverlayButtons();\n    overlay.classList.add(\"opm-hidden\");\n    buildLevel();\n\n    if (state.level >= 41) {\n      showToast(\"Final honey shelf: 18 x 8 library board.\");\n    } else if (state.level >= 13) {\n      showToast(\"The honey shelf grows trickier.\");\n    } else {\n      showToast(\"Level \" + state.level + \": more golden library treasures join the board.\");\n    }\n  }\n\n  startBtn.addEventListener(\"click\", function () {\n    initAudio();\n\n    if (state.overlayMode === \"pause\") {\n      resumeGame();\n    } else if (state.overlayMode === \"shuffleNeeded\") {\n      resolveShuffleNeeded();\n    } else if (state.overlayMode === \"next\") {\n      nextLevel();\n    } else {\n      startFreshGame();\n    }\n  });\n\n\n  saveBtn.addEventListener(\"click\", function () {\n    initAudio();\n    saveCurrentGame();\n  });\n\n  continueBtn.addEventListener(\"click\", function () {\n    initAudio();\n    loadSavedGame();\n  });\n\n  pauseBtn.addEventListener(\"click\", function () {\n    if (!state.playing) return;\n\n    if (state.paused) {\n      resumeGame();\n    } else {\n      pauseGame();\n    }\n  });\n\n  hintBtn.addEventListener(\"click\", function () {\n    if (!state.playing || state.paused || state.locked) return;\n\n    initAudio();\n    clearSelection();\n    clearHintStyles();\n\n    const move = findFirstMove();\n\n    if (!move) {\n      showShuffleNeededPopup();\n      return;\n    }\n\n    state.combo = 0;\n\n    if (!spendTimePenalty(state.hintCost)) return;\n\n    const tileA = getTileEl(move.a.r, move.a.c);\n    const tileB = getTileEl(move.b.r, move.b.c);\n\n    if (tileA) tileA.classList.add(\"opm-hint\");\n    if (tileB) tileB.classList.add(\"opm-hint\");\n\n    drawPath(move.path, true);\n    sound(\"tap\");\n    showToast(\"A little honeylight shows the way. -\" + state.hintCost + \"s\");\n\n    setTimeout(function () {\n      clearHintStyles();\n      clearLine();\n    }, 1300);\n  });\n\n  shuffleBtn.addEventListener(\"click\", function () {\n    if (!state.playing || state.paused || state.locked) return;\n\n    initAudio();\n    state.combo = 0;\n\n    if (!spendTimePenalty(state.shuffleCost)) return;\n\n    shuffleRemaining();\n    updatePanel();\n  });\n\n  function clearHintStyles() {\n    boardEl.querySelectorAll(\".opm-hint\").forEach(function (el) {\n      el.classList.remove(\"opm-hint\");\n    });\n  }\n\n  function drawPath(path, hint) {\n    clearLine();\n    resizeBoard();\n\n    if (!path || !path.length || !state.cell) return;\n\n    const cellX = state.cellX || state.cell;\n    const cellY = state.cellY || state.cell;\n    const points = path.map(function (p) {\n      const rawX = (p.c - 0.5) * cellX;\n      const rawY = (p.r - 0.5) * cellY;\n      const x = Math.max(0, Math.min(state.padW, rawX));\n      const y = Math.max(0, Math.min(state.padH, rawY));\n      return x + \",\" + y;\n    }).join(\" \");\n\n    const poly = document.createElementNS(\"http:\/\/www.w3.org\/2000\/svg\", \"polyline\");\n    poly.setAttribute(\"points\", points);\n\n    if (hint) {\n      poly.classList.add(\"opm-hintline\");\n    }\n\n    linesEl.appendChild(poly);\n  }\n\n  function clearLine() {\n    linesEl.innerHTML = \"\";\n  }\n\n  function findPath(a, b) {\n    const rows = state.maxRows + 2;\n    const cols = state.maxCols + 2;\n    const start = { r: a.r + 1, c: a.c + 1 };\n    const end = { r: b.r + 1, c: b.c + 1 };\n\n    const dirs = [\n      { r: -1, c: 0 },\n      { r: 0, c: 1 },\n      { r: 1, c: 0 },\n      { r: 0, c: -1 }\n    ];\n\n    const visited = [];\n\n    for (let r = 0; r < rows; r++) {\n      const row = [];\n      for (let c = 0; c < cols; c++) {\n        row.push([99, 99, 99, 99]);\n      }\n      visited.push(row);\n    }\n\n    const queue = [];\n\n    for (let d = 0; d < dirs.length; d++) {\n      const nr = start.r + dirs[d].r;\n      const nc = start.c + dirs[d].c;\n\n      if (canPass(nr, nc, end)) {\n        visited[nr][nc][d] = 0;\n        queue.push({\n          r: nr,\n          c: nc,\n          dir: d,\n          turns: 0,\n          path: [start, { r: nr, c: nc }]\n        });\n      }\n    }\n\n    let head = 0;\n\n    while (head < queue.length) {\n      const cur = queue[head++];\n\n      if (cur.r === end.r ? cur.c === end.c : false) {\n        return compressPath(cur.path);\n      }\n\n      for (let nd = 0; nd < dirs.length; nd++) {\n        const nextTurns = cur.turns + (nd === cur.dir ? 0 : 1);\n        if (nextTurns > 2) continue;\n\n        const nr = cur.r + dirs[nd].r;\n        const nc = cur.c + dirs[nd].c;\n\n        if (!canPass(nr, nc, end)) continue;\n        if (visited[nr][nc][nd] <= nextTurns) continue;\n\n        visited[nr][nc][nd] = nextTurns;\n\n        queue.push({\n          r: nr,\n          c: nc,\n          dir: nd,\n          turns: nextTurns,\n          path: cur.path.concat([{ r: nr, c: nc }])\n        });\n      }\n    }\n\n    return null;\n  }\n\n  function canPass(er, ec, end) {\n    if (er < 0 || ec < 0 || er >= state.maxRows + 2 || ec >= state.maxCols + 2) {\n      return false;\n    }\n\n    if (er === end.r ? ec === end.c : false) {\n      return true;\n    }\n\n    const br = er - 1;\n    const bc = ec - 1;\n\n    if (br < 0 || bc < 0 || br >= state.maxRows || bc >= state.maxCols) {\n      return true;\n    }\n\n    return state.board[br][bc] === null;\n  }\n\n  function compressPath(path) {\n    if (path.length <= 2) return path;\n\n    const clean = [path[0]];\n\n    for (let i = 1; i < path.length - 1; i++) {\n      const prev = path[i - 1];\n      const cur = path[i];\n      const next = path[i + 1];\n\n      const dir1r = cur.r - prev.r;\n      const dir1c = cur.c - prev.c;\n      const dir2r = next.r - cur.r;\n      const dir2c = next.c - cur.c;\n\n      if (dir1r !== dir2r || dir1c !== dir2c) {\n        clean.push(cur);\n      }\n    }\n\n    clean.push(path[path.length - 1]);\n    return clean;\n  }\n\n  function findFirstMove() {\n    const groups = {};\n\n    for (let r = 0; r < state.maxRows; r++) {\n      for (let c = 0; c < state.maxCols; c++) {\n        const value = state.board[r][c];\n        if (value === null) continue;\n\n        if (!groups[value]) groups[value] = [];\n        groups[value].push({ r: r, c: c });\n      }\n    }\n\n    const keys = Object.keys(groups);\n\n    for (let k = 0; k < keys.length; k++) {\n      const list = groups[keys[k]];\n\n      for (let i = 0; i < list.length; i++) {\n        for (let j = i + 1; j < list.length; j++) {\n          const path = findPath(list[i], list[j]);\n          if (path) {\n            return { a: list[i], b: list[j], path: path };\n          }\n        }\n      }\n    }\n\n    return null;\n  }\n\n  function makePlayable() {\n    let guard = 0;\n\n    while (!findFirstMove() ? guard < 220 : false) {\n      reshuffleValuesOnly();\n      guard++;\n    }\n\n    if (!findFirstMove()) {\n      forceFirstMove();\n    }\n  }\n\n  function reshuffleValuesOnly() {\n    const cells = getOccupiedCells();\n    const values = cells.map(function (cell) {\n      return state.board[cell.r][cell.c];\n    });\n\n    shuffleArray(values);\n\n    for (let i = 0; i < cells.length; i++) {\n      state.board[cells[i].r][cells[i].c] = values[i];\n    }\n  }\n\n  function forceFirstMove() {\n    const cells = getOccupiedCells();\n\n    for (let i = 0; i < cells.length; i++) {\n      const a = cells[i];\n\n      for (let j = i + 1; j < cells.length; j++) {\n        const b = cells[j];\n        const adjacent = Math.abs(a.r - b.r) + Math.abs(a.c - b.c) === 1;\n\n        if (!adjacent) continue;\n\n        const targetValue = state.board[a.r][a.c];\n        const oldBValue = state.board[b.r][b.c];\n\n        if (targetValue === oldBValue) return;\n\n        for (let m = 0; m < cells.length; m++) {\n          const mate = cells[m];\n\n          if (mate.r === a.r ? mate.c === a.c : false) continue;\n          if (mate.r === b.r ? mate.c === b.c : false) continue;\n\n          if (state.board[mate.r][mate.c] === targetValue) {\n            state.board[b.r][b.c] = targetValue;\n            state.board[mate.r][mate.c] = oldBValue;\n            return;\n          }\n        }\n      }\n    }\n  }\n\n  function shuffleRemaining() {\n    clearSelection();\n    clearHintStyles();\n    clearLine();\n\n    reshuffleValuesOnly();\n    makePlayable();\n    renderBoard();\n    updatePanel();\n    setButtons(true);\n    setPauseVisual(false);\n    sound(\"shuffle\");\n    showToast(\"The honey shelf has been gently refreshed. -\" + state.shuffleCost + \"s\");\n  }\n\n  function showToast(text) {\n    clearTimeout(state.toastTimer);\n\n    toastEl.textContent = text;\n    toastEl.classList.add(\"opm-show\");\n\n    state.toastTimer = setTimeout(function () {\n      toastEl.classList.remove(\"opm-show\");\n    }, 1650);\n  }\n\n  function isFullscreenActive() {\n    return document.fullscreenElement === root ||\n      document.webkitFullscreenElement === root ||\n      root.classList.contains(\"opm-ios-fullscreen\");\n  }\n\n  function getViewportSize() {\n    return {\n      w: window.visualViewport ? window.visualViewport.width : window.innerWidth,\n      h: window.visualViewport ? window.visualViewport.height : window.innerHeight\n    };\n  }\n\n  function updateLandscapeTransform() {\n    const size = getViewportSize();\n    const shouldRotate = isFullscreenActive() ? size.h > size.w : false;\n    root.classList.toggle(\"opm-rotateFS\", shouldRotate);\n  }\n\n  async function tryLockLandscape() {\n    try {\n      if (screen.orientation ? screen.orientation.lock : false) {\n        await screen.orientation.lock(\"landscape\");\n      }\n    } catch (e) {}\n  }\n\n  function tryUnlockOrientation() {\n    try {\n      if (screen.orientation ? screen.orientation.unlock : false) {\n        screen.orientation.unlock();\n      }\n    } catch (e) {}\n  }\n\n  function queueBoardResize() {\n    [80, 180, 360, 700].forEach(function (delay) {\n      setTimeout(function () {\n        updateLandscapeTransform();\n        resizeBoard();\n      }, delay);\n    });\n  }\n\n  async function toggleFullscreen() {\n    initAudio();\n\n    if (isFullscreenActive()) {\n      if (document.fullscreenElement || document.webkitFullscreenElement) {\n        try {\n          if (document.exitFullscreen) {\n            await document.exitFullscreen();\n          } else if (document.webkitExitFullscreen) {\n            document.webkitExitFullscreen();\n          }\n        } catch (e) {}\n      }\n\n      root.classList.remove(\"opm-ios-fullscreen\");\n      root.classList.remove(\"opm-rotateFS\");\n      tryUnlockOrientation();\n      queueBoardResize();\n      return;\n    }\n\n    try {\n      if (root.requestFullscreen) {\n        await root.requestFullscreen();\n      } else if (root.webkitRequestFullscreen) {\n        root.webkitRequestFullscreen();\n      } else {\n        root.classList.add(\"opm-ios-fullscreen\");\n      }\n    } catch (e) {\n      root.classList.add(\"opm-ios-fullscreen\");\n    }\n\n    await tryLockLandscape();\n\n    queueBoardResize();\n  }\n\n  fullscreenBtn.addEventListener(\"click\", toggleFullscreen);\n\n  muteBtn.addEventListener(\"click\", function () {\n    state.muted = !state.muted;\n    root.classList.toggle(\"opm-soundOff\", state.muted);\n    muteBtn.setAttribute(\"aria-label\", state.muted ? \"Unmute sound\" : \"Mute sound\");\n\n    if (!state.muted) {\n      initAudio();\n      sound(\"tap\");\n    }\n  });\n\n  document.addEventListener(\"fullscreenchange\", function () {\n    if (!document.fullscreenElement) {\n      root.classList.remove(\"opm-rotateFS\");\n      tryUnlockOrientation();\n    }\n\n    queueBoardResize();\n  });\n\n  document.addEventListener(\"webkitfullscreenchange\", function () {\n    if (!document.webkitFullscreenElement) {\n      root.classList.remove(\"opm-rotateFS\");\n      tryUnlockOrientation();\n    }\n\n    queueBoardResize();\n  });\n\n  window.addEventListener(\"resize\", function () {\n    setTimeout(resizeBoard, 70);\n  });\n\n  window.addEventListener(\"orientationchange\", function () {\n    setTimeout(resizeBoard, 180);\n  });\n\n  if (window.visualViewport) {\n    window.visualViewport.addEventListener(\"resize\", function () {\n      setTimeout(resizeBoard, 80);\n    });\n  }\n\n  setPauseVisual(false);\n  updatePanel();\n  setButtons(false);\n  updateOverlayButtons();\n  resizeBoard();\n})();\n<\/script>\n\n\n\n<h2 class=\"wp-block-heading\">Connect Matching Tiles Before Time Runs Out<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">The gameplay is built around clean and satisfying pair connections. Tap one tile, then tap its matching partner. If a valid path exists between them, the game draws a glowing line and removes the pair from the board. If the connection is blocked, you will need to search for another pair or use a helper.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">You can use <strong>Hint<\/strong> when you need a gentle clue, or <strong>Shuffle<\/strong> when the board feels stuck. Both helpers cost time, so every choice matters. The game also includes combo scoring, best score saving, pause control, sound toggle, fullscreen mode, and a save-and-continue system so you can return to your honeylit puzzle later.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Why You Will Love Honeybound Links<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Honeybound Links<\/strong> is perfect for players who enjoy relaxing puzzle games with a thoughtful pace. It is calm enough for a short break, but still challenging enough to keep your mind awake as the board grows more complex.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">With its warm Honey Library atmosphere, soft visual effects, cozy tile designs, responsive controls, and satisfying link-matching gameplay, <strong>Honeybound Links<\/strong> turns every level into a quiet little moment of focus. Step into the golden reading room, follow the glowing paths, and see how many shelves you can clear.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Honeybound Links is a cozy pair-matching puzzle game set inside a warm honeylit library, where every tile feels like a tiny treasure from a quiet reading room. Golden bookmarks, old books, honey jars, lamps, teacups, reading glasses, scrolls, keys, and soft amber details are waiting to be connected before time runs out. Your goal is &hellip;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[12],"tags":[],"class_list":["post-55","post","type-post","status-publish","format-standard","hentry","category-puzzle"],"_links":{"self":[{"href":"https:\/\/play.produsenpagarbrc.com\/index.php?rest_route=\/wp\/v2\/posts\/55","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/play.produsenpagarbrc.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/play.produsenpagarbrc.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/play.produsenpagarbrc.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/play.produsenpagarbrc.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=55"}],"version-history":[{"count":0,"href":"https:\/\/play.produsenpagarbrc.com\/index.php?rest_route=\/wp\/v2\/posts\/55\/revisions"}],"wp:attachment":[{"href":"https:\/\/play.produsenpagarbrc.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=55"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/play.produsenpagarbrc.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=55"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/play.produsenpagarbrc.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=55"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}