/* =========================================================================
   เฟส 2.3: ประกวดแต่งร้าน (สไตล์เฟส 4)
   ========================================================================= */
.ct-open { float: right; padding: 6px 12px; border-radius: 20px; border: 2px solid #1a1412; background: linear-gradient(180deg, #ffd166, #f4a261); color: #2b1a10;
    font-family: inherit; font-size: 11px; font-weight: 900; cursor: pointer; box-shadow: 0 3px 0 #1a1412; }
.ct-modal { max-width: 480px; max-height: calc(100% - 8px); display: flex; flex-direction: column; gap: 8px; text-align: left; overflow: hidden; }
.ct-head { display: flex; gap: 10px; align-items: center; padding: 10px; border-radius: 14px; flex-shrink: 0;
    background: radial-gradient(circle at 10% 20%, rgba(255, 209, 102, .3), transparent 55%), linear-gradient(135deg, #3a0ca3, #7209b7); border: 2px solid #ffd166; }
.ct-theme { width: 48px; height: 48px; flex-shrink: 0; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 26px;
    background: radial-gradient(circle at 38% 30%, #fff3c4, #ffd166 55%, #b5651d); border: 2.5px solid #1a1412; box-shadow: 0 3px 0 #1a1412; }
.ct-head small { display: block; font-size: 10px; color: #e0d4ff; } .ct-head b { display: block; font-size: 16px; } .ct-head span { font-size: 10.5px; color: #f3e1b6; }
.ct-phase { flex-shrink: 0; font-size: 11px; font-weight: 800; text-align: center; padding: 5px; border-radius: 10px; background: rgba(6, 214, 160, .15); color: #06d6a0; border: 1.5px solid #06d6a0; }
.ct-phase.vote { background: rgba(255, 209, 102, .15); color: #ffd166; border-color: #ffd166; }
.ct-body { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; }
.ct-canvas { height: 260px !important; flex-shrink: 0; border-radius: 12px; }
.ct-preview .ct-canvas { height: 230px !important; }
.ct-mine { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border-radius: 12px; background: rgba(6, 214, 160, .1); border: 1.5px solid #06d6a0; }
.ct-mine b { font-size: 13px; color: #06d6a0; } .ct-mine small { font-size: 10.5px; color: #ccc; }
.ct-progress { font-size: 11.5px; color: #ddd; flex-shrink: 0; } .ct-progress b { color: var(--gold); }
.ct-entry { display: flex; flex-direction: column; gap: 6px; padding: 8px; border-radius: 14px; background: linear-gradient(180deg, #33261d, #22180f); border: 1.5px solid #4f3a2a; flex-shrink: 0; }
.ct-who b { display: block; font-size: 14px; } .ct-who small { font-size: 10.5px; color: #b5a99c; }
.ct-stars { display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; }
.ct-star { padding: 8px 2px; border-radius: 10px; border: 2px solid #1a1412; background: linear-gradient(180deg, #3a2e28, #22180f); color: #ffd166; font-size: 10px; letter-spacing: -1px; cursor: pointer; box-shadow: 0 3px 0 #1a1412; font-family: inherit; }
.ct-star:hover, .ct-star:active { background: linear-gradient(180deg, #ffd166, #f4a261); color: #2b1a10; }
.ct-hall { display: flex; flex-direction: column; gap: 8px; }
.ct-hof { display: flex; flex-direction: column; gap: 4px; padding: 8px; border-radius: 14px; background: radial-gradient(circle at 50% 0%, rgba(255, 209, 102, .2), transparent 60%), #22180f; border: 2px solid #ffd166; }
.ct-hof small { font-size: 10px; color: #c9bdb1; } .ct-hof b { font-size: 13px; color: var(--gold); }
.ct-hof .ct-canvas { height: 200px !important; }
/* กรอบแชมป์ดีไซน์ */
.frame-champ { background: conic-gradient(#ffd166, #fff3c4, #e9b949, #fff3c4, #ffd166); border: 2px solid #1a1412; box-shadow: 0 0 12px #ffd166, 0 4px 0 #1a1412; }
.sign-x { }