/* Trà Chanh Quán 0.10.4.4: responsive pixel-art lucky spin, 100% separate from daily gifts.
   The action dock is outside the scrollable body and ALWAYS remains visible. */
#luckySpinSheet.tcq-lucky-sheet{position:absolute!important;inset:0!important;z-index:195!important;display:grid!important;place-items:center!important;padding:6px!important;background:rgba(11,34,31,.64)!important;backdrop-filter:blur(3px);overflow:hidden!important;color:#694a31;font-family:system-ui,-apple-system,'Segoe UI',sans-serif!important;box-sizing:border-box}
#luckySpinSheet.tcq-lucky-sheet[hidden]{display:none!important}
#luckySpinSheet .lucky-panel{position:relative;display:flex!important;flex-direction:column!important;width:min(520px,100%)!important;max-height:calc(100dvh - 12px)!important;height:min(760px,calc(100dvh - 12px))!important;min-height:0!important;overflow:hidden!important;border:4px solid #206b62;border-radius:22px;background:linear-gradient(180deg,#fff2cd,#fff0d6);box-shadow:0 5px 0 #113f48,0 15px 40px #0008;box-sizing:border-box}
#luckySpinSheet .lucky-panel:after{content:"";position:absolute;inset:5px;border:2px solid #fffce7;border-radius:15px;pointer-events:none;z-index:0}
#luckySpinSheet .lucky-title{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;flex:0 0 auto!important;margin:7px 7px 0!important;min-height:57px!important;padding:8px 48px 8px 33px!important;border:3px solid #78c3ac;border-radius:14px;background:linear-gradient(175deg,#2bb4a0 0%,#18887e 63%,#17696a 100%);box-shadow:inset 0 3px #60d9bc,inset 0 -6px #095961,0 2px 0 #b28144;color:#fff8d9;text-shadow:2px 3px #175b58}
#luckySpinSheet .lucky-title:before{content:"☘";position:absolute;left:9px;top:50%;transform:translateY(-50%);font-size:23px;color:#97e275;text-shadow:2px 2px #28733f}
#luckySpinSheet .lucky-title h2{margin:0!important;font-size:clamp(17px,4.4vw,24px)!important;letter-spacing:.004em;font-weight:1000;line-height:1.12;white-space:nowrap;text-align:center}
#luckySpinSheet .lucky-spark{display:none}
#luckySpinSheet .lucky-close{position:absolute;right:7px;top:50%;transform:translateY(-50%);width:37px;height:37px;border:3px solid #3d5261;border-radius:8px;background:linear-gradient(#fff7db,#f6dab0);box-shadow:inset 0 -4px #ceaa77;color:#735333;font-size:26px;font-weight:1000;line-height:1;cursor:pointer}
#luckySpinSheet .lucky-title-sub{position:relative;z-index:1;flex:0 0 auto;margin:4px 9px 2px;text-align:center;font-size:10px;line-height:1.25;font-weight:900;color:#7d6039;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#luckySpinSheet .lucky-body{position:relative;z-index:1;flex:1 1 auto!important;min-height:0!important;overflow-x:hidden!important;overflow-y:auto!important;overscroll-behavior:contain;padding:4px 9px 8px!important;scrollbar-width:thin;scrollbar-color:#c3a27a transparent}
#luckySpinSheet .lucky-body::-webkit-scrollbar{width:5px}
#luckySpinSheet .lucky-body::-webkit-scrollbar-thumb{border-radius:8px;background:#ceb08a}
#luckySpinSheet .lucky-loading{padding:38px 10px;text-align:center;font-size:13px;font-weight:800}
#luckySpinSheet .lucky-back{display:block;margin:0 auto;padding:8px 16px;border:2px solid #9cc59b;border-radius:10px;background:#eaf8e1;font-weight:900}
#luckySpinSheet .lucky-quickbar{display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:32px;padding:4px 9px;margin:2px 0 6px;border:1px solid #b1d49c;border-radius:10px;background:linear-gradient(180deg,#eefbdd,#dff4cc);color:#3f7143}
#luckySpinSheet .lucky-turns{font-size:12px;font-weight:1000}
#luckySpinSheet .lucky-turns-help{font-size:10px;font-weight:800;color:#739061;white-space:nowrap}
#luckySpinSheet .lucky-arena-card{margin:0 0 7px;padding:5px 5px 2px;border-radius:15px;border:2px solid #d9b575;background:radial-gradient(ellipse at center,#faffea 0%,#f6edc3 100%);box-shadow:0 2px 0 #e9c68e}
#luckySpinSheet .lucky-arena{position:relative;display:grid;place-items:center;width:min(73vw,262px,32dvh)!important;height:auto!important;aspect-ratio:1!important;margin:0 auto 1px!important;overflow:visible}
#luckySpinSheet .lucky-wheel-shell{position:absolute;inset:3.5%;border-radius:50%;border:8px solid #ffca36;background:#e8f9cf;box-shadow:inset 0 0 0 4px #378d46,inset 0 0 0 9px #b8eb69,0 0 0 3px #965a21,0 4px 0 5px #705022;overflow:hidden}
#luckySpinSheet .lucky-wheel-rotor{position:absolute;inset:10px;border-radius:50%;overflow:hidden;transform-origin:center;will-change:transform}
#luckySpinSheet .lucky-wheel-face{position:absolute;inset:0;border-radius:50%;border:2px solid #56a952;background:conic-gradient(from -25.714285714deg,#f7fce2 0deg 51.428571429deg,#cdecae 51.428571429deg 102.857142858deg,#f7fce2 102.857142858deg 154.285714287deg,#cdecae 154.285714287deg 205.714285716deg,#f7fce2 205.714285716deg 257.142857145deg,#cdecae 257.142857145deg 308.571428574deg,#f7fce2 308.571428574deg 360deg)}
#luckySpinSheet .lucky-wheel-face:after{content:"";position:absolute;inset:0;border-radius:50%;background:repeating-conic-gradient(from -25.714285714deg,#4b9e57b3 0 1deg,transparent 1deg 51.428571429deg);pointer-events:none}
#luckySpinSheet .lucky-wheel-bulbs{position:absolute;inset:1%;border-radius:50%;pointer-events:none;z-index:3;background:repeating-conic-gradient(from 0deg,#ffeb7a 0deg 3deg,transparent 3deg 30deg);-webkit-mask:radial-gradient(circle,transparent 0 85%,#000 86% 92%,transparent 93%);mask:radial-gradient(circle,transparent 0 85%,#000 86% 92%,transparent 93%);filter:drop-shadow(0 0 3px #ffcd5c)}
#luckySpinSheet .lucky-wedge-item{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;width:21%;height:21%;filter:drop-shadow(0 1px 1px #79a25e)}
#luckySpinSheet .lucky-wedge-art{display:grid;place-items:center;flex:1 1 auto;min-height:0;width:100%;padding:4px;border-radius:11px;border:2px solid #8ead74;background:#fffae9;box-sizing:border-box}
#luckySpinSheet .lucky-item-sprite{display:block;width:100%;height:100%;object-fit:contain;image-rendering:pixelated}
#luckySpinSheet .lucky-empty-icon{display:grid;place-items:center;font-size:21px;font-weight:1000;color:#b88a2b}
#luckySpinSheet .lucky-slot-symbol{font-size:clamp(16px,4.8vw,27px);line-height:1}
#luckySpinSheet .lucky-slot-symbol.is-xp{color:#e9a31d}
#luckySpinSheet .lucky-wedge-item small{position:relative;z-index:1;max-width:150%;margin-top:-1px;padding:1px 3px;border-radius:5px;background:#fffbddec;color:#57764d;font-size:clamp(7px,1.9vw,10px);line-height:1.1;font-weight:1000;white-space:nowrap}
#luckySpinSheet .lucky-pointer{position:absolute;z-index:8;top:0;left:50%;transform:translateX(-50%);width:29px;height:38px;background:none;filter:drop-shadow(0 2px #6e391b);pointer-events:none}
#luckySpinSheet .lucky-pointer:before{content:"";position:absolute;top:-3px;left:7px;width:16px;height:16px;background:#ffdc4c;border:2px solid #aa5425;transform:rotate(45deg)}
#luckySpinSheet .lucky-pointer:after{content:"";position:absolute;top:15px;left:5px;border-left:10px solid transparent;border-right:10px solid transparent;border-top:22px solid #e35721}
#luckySpinSheet .lucky-wheel-center-ring{position:absolute;z-index:4;width:41%;aspect-ratio:1;border-radius:50%;background:#ffc94b;box-shadow:0 0 0 4px #b5712b,0 4px 0 5px #8c4a20;pointer-events:none}
#luckySpinSheet .lucky-spin-button{position:absolute;z-index:5;width:35%;aspect-ratio:1;border-radius:50%;border:4px solid #166499;background:radial-gradient(circle at 30% 25%,#90e8ff 0%,#42b6fa 36%,#0986d7 74%,#0469af 100%);box-shadow:inset 0 -7px #04639e,inset 0 4px #d1f8ff,0 3px #174f72;color:#fff;font-size:clamp(12px,4vw,21px);font-weight:1000;line-height:1.05;text-shadow:1px 2px #21639a;cursor:pointer}
#luckySpinSheet .lucky-spin-button:disabled{opacity:.93;cursor:default}
#luckySpinSheet .lucky-spin-button:not(:disabled):active{transform:translateY(2px)}
#luckySpinSheet .lucky-wheel-legend{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:3px;font-size:10px;font-weight:850;color:#81603c;text-align:center;line-height:1.25}
#luckySpinSheet .lucky-wheel-legend i{display:inline-block;width:3px;height:3px;border-radius:50%;background:#c6a273;margin:0 3px}
#luckySpinSheet .lucky-selected-strip{display:flex;align-items:center;gap:7px;min-height:43px;margin-bottom:7px;padding:5px 8px;border:1px solid #e1c18e;border-radius:12px;background:#fff9e7}
#luckySpinSheet .lucky-selected-strip.is-active{border-color:#b6d29e;background:#f4ffe8}
#luckySpinSheet .lucky-selected-art{flex:0 0 32px;display:grid;place-items:center;width:32px;height:32px;border:1px solid #afc796;border-radius:8px;background:#fffae8}
#luckySpinSheet .lucky-selected-strip>div{flex:1;min-width:0}
#luckySpinSheet .lucky-selected-strip small{display:block;color:#946e4d;font-size:9px;font-weight:900;line-height:1.1}
#luckySpinSheet .lucky-selected-strip strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#6a4a33;font-size:12px}
#luckySpinSheet .lucky-selected-tip{flex:0 0 auto;border-radius:10px;padding:4px 7px;background:#e7f3d7;color:#60824e;font-size:9px;font-weight:900}
#luckySpinSheet .lucky-reward-section{margin-bottom:6px;padding:8px 8px 7px;border:2px solid #e1c28f;border-radius:14px;background:#fff9ec}
#luckySpinSheet .lucky-reward-section header{display:flex;justify-content:space-between;gap:6px;align-items:center;margin-bottom:7px}
#luckySpinSheet .lucky-reward-section h3{margin:0;color:#765238;font-size:14px;line-height:1.15;font-weight:950}
#luckySpinSheet .lucky-reward-section header small{display:block;margin-top:3px;font-size:10px;color:#9a7555;line-height:1.2}
#luckySpinSheet .lucky-reward-section header>span{flex:0 0 auto;padding:4px 7px;border-radius:999px;background:#e8f5db;color:#5c844b;font-size:10px;font-weight:850}
#luckySpinSheet .lucky-reward-scroll{display:grid;grid-auto-flow:column;grid-auto-columns:96px;gap:6px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;scroll-snap-type:x proximity;padding:1px 1px 3px}
#luckySpinSheet .lucky-reward{display:flex;flex-direction:column;align-items:center;gap:3px;scroll-snap-align:start;min-width:0;min-height:102px;height:102px!important;padding:5px 4px;border:2px solid #d0dcb7;border-radius:12px;background:#f4fbea;color:#684b35;cursor:pointer;box-shadow:0 1px 0 #d3d5a8}
#luckySpinSheet .lucky-reward.selected{background:#e9f8d8;border-color:#4fa164;box-shadow:0 0 0 2px #edc95f}
#luckySpinSheet .lucky-reward.is-owned{background:#f3eee3;border-color:#d6cdba}
#luckySpinSheet .lucky-reward:disabled{opacity:.65;cursor:default}
#luckySpinSheet .lucky-reward-image{display:grid;place-items:center;flex:0 0 48px;width:48px;height:48px;border-radius:9px;border:2px solid #829f6c;background:#fff8e8}
#luckySpinSheet .lucky-reward strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;width:100%;min-height:0;text-align:center;line-height:1.12;font-size:10px;font-weight:850;overflow-wrap:anywhere}
#luckySpinSheet .lucky-choice-state{margin-top:auto;display:block;width:100%;padding:2px 1px;border-radius:6px;background:#e3f0d9;color:#4d8545;text-align:center;font-size:8px;font-weight:1000;line-height:1.05}
#luckySpinSheet .lucky-reward.selected .lucky-choice-state{background:#80ba73;color:#fff}
#luckySpinSheet .lucky-status{min-height:25px;padding:5px 8px;margin:0 0 5px;border:1px solid #bad39d;border-radius:9px;background:#eff8de;color:#52754a;font-size:11px;line-height:1.3;text-align:center;font-weight:850;overflow-wrap:anywhere}
#luckySpinSheet .lucky-status.is-done{background:#e6f3d6}
#luckySpinSheet .lucky-details{margin:5px 0;padding:9px;border:1px solid #e2bd86;border-radius:10px;background:#fffae8;display:grid;gap:6px}
#luckySpinSheet .lucky-details[hidden]{display:none}
#luckySpinSheet .lucky-details h4{font-size:13px;margin:0}
#luckySpinSheet .lucky-details>div{display:flex;align-items:center;justify-content:space-between;gap:6px;border-bottom:1px solid #ecddbc;padding:4px 0;font-size:11px}
#luckySpinSheet .lucky-details p{font-size:11px;margin:0}
#luckySpinSheet .lucky-details span{font-weight:850;color:#6d874d}
#luckySpinSheet .lucky-footnote{margin:6px 2px 0;font-size:9px;text-align:center;line-height:1.25;color:#987757}
#luckySpinSheet .lucky-action-dock{position:relative;z-index:3;flex:0 0 auto!important;display:grid!important;gap:5px;padding:7px 11px calc(10px + env(safe-area-inset-bottom,0px));border-top:2px solid #e3c08b;background:linear-gradient(#fff4d7,#ffe7bd);box-shadow:0 -4px 11px #96633218}
#luckySpinSheet .lucky-primary-cta{width:100%;height:39px;min-height:39px;border:2px solid #a96f2a;border-radius:11px;background:linear-gradient(#ffe99a,#ffc347 65%,#efa32b);box-shadow:inset 0 -4px #d58d24,0 2px 0 #915522;color:#683b14;font-weight:1000;font-size:14px;text-shadow:0 1px #ffeaba;cursor:pointer}
#luckySpinSheet .lucky-primary-cta:disabled{opacity:.62;cursor:default}
#luckySpinSheet .lucky-dock-subactions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
#luckySpinSheet .lucky-dock-subactions button{min-width:0;min-height:31px;padding:5px 3px;border:1px solid #d2b48b;border-radius:9px;background:#fffaf0;color:#795837;font-size:11px;font-weight:900;cursor:pointer}
#luckySpinSheet .lucky-dock-subactions button[aria-expanded=true]{background:#ddefd8;border-color:#83b078;color:#46794d}
#luckySpinSheet button:focus-visible{outline:3px solid #e85c8e!important;outline-offset:2px!important}
@media(max-width:375px){#luckySpinSheet .lucky-title h2{font-size:17px!important}#luckySpinSheet .lucky-arena{width:min(73vw,235px,30dvh)!important}#luckySpinSheet .lucky-reward-scroll{grid-auto-columns:90px}#luckySpinSheet .lucky-body{padding-left:7px!important;padding-right:7px!important}#luckySpinSheet .lucky-reward-section h3{font-size:13px}}
@media(max-height:700px){#luckySpinSheet .lucky-arena{width:min(70vw,215px,29dvh)!important}#luckySpinSheet .lucky-title{min-height:48px!important}#luckySpinSheet .lucky-body{padding-top:2px!important}#luckySpinSheet .lucky-reward{height:91px!important;min-height:91px}#luckySpinSheet .lucky-reward-image{flex-basis:40px;width:40px;height:40px}#luckySpinSheet .lucky-turns-help{display:none}}
@media(prefers-reduced-motion:reduce){#luckySpinSheet *{scroll-behavior:auto!important;animation:none!important}}
/* Vivid retro signboard and clover accents: same layout, more of the approved pixel-game character. */
#luckySpinSheet .lucky-title{border-color:#8f6134;background:linear-gradient(180deg,#b8864b 0%,#986131 21%,#765028 46%,#345b46 47%,#277568 100%);box-shadow:inset 0 3px #dfba76,inset 0 -6px #16574d,0 2px 0 #7b562d}
#luckySpinSheet .lucky-title h2{color:#ffe99e;text-shadow:-1px -1px #6e431e,1px -1px #6e431e,-1px 2px #6e431e,2px 3px #4b351e,0 0 5px #ffdc7499;letter-spacing:.006em}
#luckySpinSheet .lucky-title:before{color:#a9ee75;text-shadow:1px 2px #194e2c}
#luckySpinSheet .lucky-arena-card{position:relative;background:radial-gradient(ellipse at 50% 32%,#fcffe8,#eaf6cd 78%,#eff0bd)}
#luckySpinSheet .lucky-arena-card:before,#luckySpinSheet .lucky-arena-card:after{content:"☘";position:absolute;bottom:8px;z-index:0;font-size:21px;color:#79ae4d;text-shadow:2px 2px #486f2e;pointer-events:none}
#luckySpinSheet .lucky-arena-card:before{left:9px;transform:rotate(-16deg)}
#luckySpinSheet .lucky-arena-card:after{right:9px;transform:rotate(16deg)}

/* v0.10.5.3: weighted wedge sectors are drawn from real probabilities, not fixed 1/7. */
#luckySpinSheet .lucky-wheel-face:after{background:none!important}
#luckySpinSheet .lucky-wedge-item small{font-size:clamp(6px,1.65vw,9px);max-width:150%;overflow:hidden;text-overflow:ellipsis}
