.chuncortile-page{min-height:80vh;color:#eee9e3;background:radial-gradient(circle at 82% 3%,rgba(255,91,45,.14),transparent 27%),radial-gradient(circle at 7% 0%,rgba(45,107,125,.10),transparent 26%),linear-gradient(180deg,#08090b,#0c0e11 58%,#08090b)}.ct-shell{width:min(1100px,96vw);margin:0 auto;padding:20px 0 72px}.ct-navline{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:0 2px 12px;color:#898d96;font-size:10px;letter-spacing:.08em}.ct-navline a{color:#aaaeb7}.ct-game{position:relative}.ct-topbar{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:10px}.ct-brand{display:flex;align-items:center;gap:13px}.ct-brand-icon{display:grid;place-items:center;width:52px;height:52px;border:1px solid #343840;border-radius:14px;background:#171a20;box-shadow:0 10px 28px #0005}.ct-brand-icon .ct-face{width:42px;height:42px}.ct-brand h1{margin:0;font-size:30px;line-height:1;letter-spacing:-.055em}.ct-brand p{margin:7px 0 0;color:#9297a1;font-size:11px}.ct-brand p strong{color:#ff7650}.ct-stats{display:flex;gap:7px}.ct-stat{min-width:92px;padding:8px 13px;border:1px solid #30343b;border-radius:15px;background:#14171c;text-align:center}.ct-stat span{display:block;color:#828791;font-size:8px;letter-spacing:.08em}.ct-stat strong{display:block;margin-top:1px;font-size:19px;color:#f6f3ee;font-variant-numeric:tabular-nums}.ct-stat strong b{font-size:22px;color:#ff7650}.ct-timer strong{color:#ffdf74}.ct-time-track{height:7px;margin-bottom:8px;border:1px solid #292d33;border-radius:999px;background:#111318;overflow:hidden}.ct-time-track>div{width:100%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#41b883,#ffd23f,#ff5b45);transform-origin:left;transition:transform .1s linear}.ct-layout{display:grid;grid-template-columns:150px minmax(0,760px) 104px;justify-content:center;align-items:start;gap:10px}.ct-side{display:grid;gap:9px}.ct-panel,.ct-board-card,.ct-tool{border:1px solid #292e36;background:#11141a;box-shadow:0 14px 34px #0003}.ct-panel{padding:16px;border-radius:17px}.ct-kicker{color:#ff754f;font-size:8px;font-weight:1000;letter-spacing:.14em}.ct-panel h2{margin:6px 0 10px;font-size:18px}.ct-panel ol{margin:0;padding-left:18px;color:#a9aeb7;font-size:11px;line-height:1.65}.ct-panel li+li{margin-top:7px}.ct-panel b{color:#f3eee8}.ct-warning{background:#181316;border-color:#512c2b}.ct-warning strong{font-size:11px;color:#ff8067}.ct-warning p{margin:7px 0 0;color:#aa9998;font-size:10px;line-height:1.6}.ct-warning p b{color:#ff8067}.ct-board-card{min-width:0;padding:8px;border-radius:18px}.ct-board-head{display:grid;grid-template-columns:105px minmax(0,1fr) 80px;align-items:center;gap:8px;padding:5px 7px 10px}.ct-board-head>div{display:flex;align-items:baseline;gap:7px}.ct-board-head span{color:#858b96;font-size:8px}.ct-board-head strong{font-size:14px;color:#f4eee8;font-variant-numeric:tabular-nums}.ct-board-head p{margin:0;text-align:center;color:#9298a3;font-size:10px}.ct-board-wrap{position:relative;overflow:hidden;border:1px solid #2d3a45;border-radius:13px;background:#151c27;box-shadow:inset 0 0 0 1px #ffffff05}.ct-board{display:grid;grid-template-columns:repeat(25,minmax(0,1fr));width:100%;aspect-ratio:25/18;background:repeating-linear-gradient(0deg,transparent 0 calc(100% / 18 - 1px),#ffffff035 calc(100% / 18 - 1px) calc(100% / 18)),repeating-linear-gradient(90deg,transparent 0 calc(100% / 25 - 1px),#ffffff035 calc(100% / 25 - 1px) calc(100% / 25));touch-action:manipulation}.ct-cell{position:relative;display:grid;place-items:center;min-width:0;min-height:0;padding:0;border:0;background:transparent;cursor:pointer}.ct-cell:focus-visible{z-index:3;outline:2px solid #fff;outline-offset:-2px}.ct-cell.is-empty:hover,.ct-cell.is-hint{background:#75d4ff12;box-shadow:inset 0 0 0 1px #75d4ff55}.ct-cell.is-hint{animation:ctHint .72s ease-in-out infinite alternate}.ct-cell.is-tile{cursor:default}.ct-tile{position:absolute;inset:12%;display:grid;place-items:center;border:1px solid #ffffff30;border-radius:14%;box-shadow:inset 0 1px 1px #ffffff55,0 2px 4px #0007;overflow:hidden;transition:transform .16s ease,opacity .16s ease}.ct-cell.is-clearing .ct-tile{transform:scale(.15) rotate(18deg);opacity:0}.ct-face{display:block;width:92%;height:92%;background-image:url('assets/chuncortile/tiles-user.webp');background-size:400% 300%;background-repeat:no-repeat;background-color:transparent;filter:drop-shadow(0 1px 0 #ffffff2c)}.ct-face-1{background-position:0% 0%}.ct-face-2{background-position:33.333% 0%}.ct-face-3{background-position:66.666% 0%}.ct-face-4{background-position:100% 0%}.ct-face-5{background-position:0% 50%}.ct-face-6{background-position:33.333% 50%}.ct-face-7{background-position:66.666% 50%}.ct-face-8{background-position:100% 50%}.ct-face-9{background-position:0% 100%}.ct-face-10{background-position:33.333% 100%}.ct-face-11{background-position:66.666% 100%}.type-0{background:linear-gradient(#27d23d,#05aa27)}.type-1{background:linear-gradient(#2f85ff,#155bd8)}.type-2{background:linear-gradient(#ff426d,#e81447)}.type-3{background:linear-gradient(#ffd83f,#f8ad00)}.type-4{background:linear-gradient(#ff8538,#ec5512)}.type-5{background:linear-gradient(#be48ff,#7d18d4)}.type-6{background:linear-gradient(#28d5d4,#08a6b4)}.type-7{background:linear-gradient(#a86728,#744018)}.type-8{background:linear-gradient(#bfc4c9,#81878b)}.type-9{background:linear-gradient(#ff65b1,#dd378a)}.type-10{background:linear-gradient(#60d668,#359f44)}.ct-board-note{margin:7px 3px 0;text-align:center;color:#737a86;font-size:9px}.ct-board-note b{color:#bfc5ce}.ct-tools{grid-auto-rows:1fr}.ct-tool{min-height:75px;border-radius:16px;color:#d8dde4;cursor:pointer}.ct-tool span{display:block;font-size:20px}.ct-tool b{display:block;margin-top:2px;font-size:10px}.ct-tool small{display:block;margin-top:1px;color:#7f8590;font-size:7px}.ct-tool:hover{border-color:#4a5059;background:#171b21}.ct-tool.danger:hover{border-color:#7a3933;background:#221615}.ct-overlay{position:absolute;z-index:12;inset:0;display:grid;place-items:center;padding:16px;background:#090c10d9;backdrop-filter:blur(7px)}.ct-overlay.hidden{display:none}.ct-overlay-card{width:min(430px,92%);padding:25px;border:1px solid #343942;border-radius:20px;background:linear-gradient(160deg,#171b21,#101216);box-shadow:0 22px 70px #0008;text-align:center}.ct-overlay-card h2{margin:7px 0 8px;font-size:28px;letter-spacing:-.05em}.ct-overlay-card h2 em{color:#ff7650;font-style:normal}.ct-overlay-card p{margin:0;color:#949aa5;font-size:11px;line-height:1.65}.ct-preview{display:flex;justify-content:center;gap:7px;margin:15px 0}.ct-mini{display:grid;place-items:center;width:38px;height:38px;border:1px solid #ffffff2b;border-radius:8px}.ct-mini .ct-face{width:32px;height:32px}.ct-primary,.ct-secondary{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 18px;border-radius:11px;font-weight:900;text-decoration:none;cursor:pointer}.ct-primary{border:0;background:linear-gradient(135deg,#ff7b43,#ff4b2b);color:#190904;box-shadow:0 8px 20px #ff572233}.ct-secondary{border:1px solid #353b43;background:#1c2027;color:#dce0e6}.ct-overlay-actions{display:flex;justify-content:center;gap:8px;margin-top:15px}.ct-countdown{}.ct-countdown strong,#ct-countdown>strong{font-size:clamp(72px,14vw,150px);color:#ff7650;text-shadow:0 8px 40px #ff5c3644}.ct-result-score{display:flex;align-items:baseline;justify-content:center;gap:6px;margin:8px 0}.ct-result-score strong{font-size:64px;line-height:1;color:#ff7650}.ct-result-score span{color:#828894}.ct-result-meta{display:flex;justify-content:center;gap:18px;margin-top:11px;color:#8f959f;font-size:10px}.ct-result-meta b{color:#eee}.ct-flash{position:absolute;z-index:8;inset:0;pointer-events:none;border-radius:13px;opacity:0}.ct-flash.miss{animation:ctMiss .34s ease}.ct-flash.good{animation:ctGood .32s ease}@keyframes ctMiss{0%{opacity:0;background:#ff2d2112}45%{opacity:1;background:#ff2d2130;box-shadow:inset 0 0 45px #ff2d2166}100%{opacity:0}}@keyframes ctGood{0%{opacity:0;background:#49e78b0a}45%{opacity:1;background:#49e78b18}100%{opacity:0}}@keyframes ctHint{from{background:#75d4ff09}to{background:#75d4ff28}}@media(max-width:1100px){.ct-layout{grid-template-columns:175px minmax(0,1fr) 84px}.ct-panel{padding:13px}.ct-tool{min-height:66px}}@media(max-width:850px){.ct-shell{width:min(100% - 14px,760px)}.ct-topbar{align-items:flex-start}.ct-layout{grid-template-columns:1fr}.ct-howto{grid-template-columns:1fr 1fr;order:2}.ct-board-card{order:1}.ct-tools{order:3;grid-template-columns:repeat(5,minmax(0,1fr))}.ct-tool{min-height:55px}.ct-board-head{grid-template-columns:90px 1fr 65px}.ct-brand p{display:none}}@media(max-width:600px){.ct-shell{width:100%;padding:12px 5px 48px}.ct-navline{padding:0 5px 9px}.ct-topbar{gap:8px;padding:0 5px}.ct-brand-icon{width:41px;height:41px;border-radius:11px}.ct-brand-icon .ct-face{width:34px;height:34px}.ct-brand h1{font-size:23px}.ct-stats{gap:4px}.ct-stat{min-width:0;padding:6px 8px;border-radius:11px}.ct-stat span{font-size:7px}.ct-stat strong{font-size:14px}.ct-stat strong b{font-size:17px}.ct-layout{gap:7px}.ct-board-card{padding:4px;border-radius:11px}.ct-board-wrap{border-radius:8px}.ct-board-head{padding:3px 4px 7px}.ct-board-head p{font-size:8px}.ct-board-head span{font-size:7px}.ct-board-head strong{font-size:11px}.ct-tile{inset:8%;border-radius:16%}.ct-board-note{font-size:8px}.ct-howto{grid-template-columns:1fr}.ct-panel{padding:12px}.ct-panel h2{font-size:15px}.ct-panel ol{font-size:10px}.ct-tools{grid-template-columns:repeat(5,minmax(0,1fr))}.ct-tool{min-height:50px;border-radius:11px}.ct-tool span{font-size:16px}.ct-overlay{padding:8px}.ct-overlay-card{padding:18px}.ct-overlay-card h2{font-size:23px}.ct-result-score strong{font-size:52px}}
.ct-combo-pop{position:absolute;z-index:10;left:50%;top:12%;transform:translate(-50%,-50%) scale(.65);pointer-events:none;opacity:0;color:#fff;font-weight:1000;font-size:clamp(22px,4vw,48px);letter-spacing:-.05em;text-shadow:0 3px 0 #7f2b0f,0 0 20px #ff763f99}.ct-combo-pop.show{animation:ctComboPop .72s cubic-bezier(.2,.9,.2,1)}.ct-combo-pop.hot{color:#ffe45b;text-shadow:0 3px 0 #8b4d00,0 0 26px #ffad33aa}
.ct-fx-layer{position:absolute;z-index:9;inset:0;pointer-events:none;overflow:hidden}.ct-burst{position:absolute;width:8px;height:8px;border-radius:2px;background:var(--burst,#fff);box-shadow:0 0 10px color-mix(in srgb,var(--burst,#fff) 70%,transparent);animation:ctBurst .62s cubic-bezier(.15,.75,.3,1) forwards}.ct-score-pop{position:absolute;z-index:10;transform:translate(-50%,-50%);color:#fff5dc;font-size:16px;font-weight:1000;text-shadow:0 2px 8px #000;animation:ctScorePop .72s ease-out forwards}
.ct-overlay-actions{flex-wrap:wrap}.ct-overlay-actions-stack{display:grid;grid-template-columns:1fr 1fr;width:min(360px,100%);margin-left:auto;margin-right:auto}.ct-return-minigames{border-color:#ff765044;color:#ffb189}.ct-over-card{width:min(520px,94%)}
.ct-ranking-submit-panel{margin-top:14px;padding:12px;border:1px solid #353a43;border-radius:13px;background:#0e1014;text-align:left}.ct-ranking-submit-panel label{display:grid;gap:5px;color:#9da2ab;font-size:9px}.ct-ranking-submit-panel input{width:100%;height:38px;padding:0 10px;border:1px solid #343a43;border-radius:9px;background:#171a20;color:#f5f1ec;outline:none}.ct-ranking-submit-panel input:focus{border-color:#ff7650}.ct-ranking-submit-panel>div{display:flex;gap:7px;margin-top:8px}.ct-ranking-submit-panel button{min-height:34px;padding:0 12px;border:1px solid #3b414a;border-radius:8px;background:#1b1f25;color:#e7e2dd;cursor:pointer}.ct-ranking-submit-panel button:first-child{border-color:#ff765055;background:#ff765018;color:#ffad8d}.ct-ranking-submit-panel p{min-height:16px;margin:7px 0 0;font-size:9px}.ct-ranking-submit-panel p[data-state="success"]{color:#60d990}.ct-ranking-submit-panel p[data-state="error"]{color:#ff766b}
.ct-modal[hidden]{display:none}.ct-modal{position:fixed;z-index:150;inset:0;display:grid;place-items:center;padding:20px}.ct-modal-backdrop{position:absolute;inset:0;background:#050608cc;backdrop-filter:blur(7px)}.ct-modal-card{position:relative;width:min(560px,94vw);max-height:min(720px,86dvh);overflow:auto;padding:20px;border:1px solid #373d46;border-radius:20px;background:linear-gradient(160deg,#181b20,#0d0f13);box-shadow:0 26px 80px #000b}.ct-modal-card header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.ct-modal-card h2{margin:4px 0 0;font-size:25px}.ct-modal-card header button{width:36px;height:36px;border:1px solid #353b44;border-radius:10px;background:#171a20;color:#ddd;font-size:22px;cursor:pointer}.ct-ranking-status{margin:13px 0;color:#858b94;font-size:10px}.ct-ranking-list{display:grid;gap:6px;margin:0;padding:0;list-style:none}.ct-ranking-list li{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 11px;border:1px solid #292e35;border-radius:11px;background:#11141a}.ct-ranking-list li>span:first-child{color:#ff8b60;font-weight:1000}.ct-ranking-list strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}.ct-ranking-list li>span:last-child{color:#aab0ba;font-size:9px;text-align:right}.ct-ranking-list li>span:last-child b{color:#fff;font-size:11px}
@keyframes ctComboPop{0%{opacity:0;transform:translate(-50%,-50%) scale(.55)}22%{opacity:1;transform:translate(-50%,-50%) scale(1.16)}68%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-75%) scale(.92)}}@keyframes ctBurst{0%{opacity:1;transform:translate(-50%,-50%) scale(.5) rotate(0)}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(.12) rotate(260deg)}}@keyframes ctScorePop{0%{opacity:0;transform:translate(-50%,-30%) scale(.7)}22%{opacity:1;transform:translate(-50%,-55%) scale(1.12)}100%{opacity:0;transform:translate(-50%,-150%) scale(.9)}}
@media(max-width:600px){.ct-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));flex:1}.ct-stat{padding-left:5px;padding-right:5px}.ct-stat strong{font-size:12px}.ct-stat strong b{font-size:15px}.ct-overlay-actions-stack{grid-template-columns:1fr}.ct-ranking-list li{grid-template-columns:28px minmax(0,1fr) auto;padding:8px}.ct-tools{gap:4px}.ct-tool{padding-left:2px;padding-right:2px}.ct-tool b{font-size:9px}.ct-tool small{font-size:6px}}

/* Match Chuncortile desktop footprint to Chungwagame */
@media(max-height:760px) and (min-width:900px){
  .ct-shell{width:min(1000px,96vw)}
  .ct-layout{grid-template-columns:136px minmax(0,680px) 96px}
  .ct-panel{padding:12px}
  .ct-tool{min-height:62px}
}
@media(max-height:650px) and (min-width:900px){
  .ct-howto{display:none}
  .ct-layout{grid-template-columns:126px minmax(0,620px) 92px}
  .ct-tool{min-height:54px}
}


/* Compact desktop footprint: aligned with Chungwagame. */
@media(min-width:1101px){
  .ct-topbar{margin-bottom:8px}
  .ct-brand-icon{width:48px;height:48px}
  .ct-brand-icon .ct-face{width:39px;height:39px}
  .ct-brand h1{font-size:27px}
  .ct-stat{min-width:86px;padding:7px 10px}
  .ct-stat strong{font-size:18px}
  .ct-panel{padding:12px}
  .ct-panel h2{font-size:16px}
  .ct-panel ol{font-size:10px;line-height:1.5}
  .ct-warning p{font-size:9px}
  .ct-tool{min-height:66px}
  .ct-board-card{padding:7px}
  .ct-board-head{min-height:33px;padding:0 4px 5px}
  .ct-board-note{margin-top:5px}
}

/* Desktop sizing moved to game-layout.css; match-path FX remain local. */
.ct-cell.is-clearing{z-index:4}
.ct-cell.is-clearing .ct-tile{
  animation:ctTileClearStrong .36s cubic-bezier(.16,.82,.28,1) forwards;
}
.ct-match-line{
  position:absolute;
  z-index:11;
  height:0;
  border-top:5px dashed var(--match-color,#ff7650);
  transform-origin:0 50%;
  filter:drop-shadow(0 0 5px var(--match-color,#ff7650));
  animation:ctMatchLine .46s ease-out forwards
}
.ct-match-line::before,.ct-match-line::after{
  content:"";
  position:absolute;
  top:50%;
  width:11px;height:11px;
  border:3px solid var(--match-color,#ff7650);
  border-radius:50%;
  background:#111a;
  box-shadow:0 0 12px var(--match-color,#ff7650);
  transform:translate(-50%,-50%)
}
.ct-match-line::after{left:100%}
.ct-clear-ring{
  position:absolute;z-index:12;
  width:18px;height:18px;
  border:4px solid var(--match-color,#ff7650);
  border-radius:50%;
  transform:translate(-50%,-50%);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--match-color,#ff7650) 22%,transparent),0 0 22px var(--match-color,#ff7650);
  animation:ctClearRing .48s ease-out forwards
}
.ct-burst{
  width:11px;height:11px;border-radius:3px;
  box-shadow:0 0 16px color-mix(in srgb,var(--burst,#fff) 85%,transparent)
}
.ct-score-pop{
  z-index:13;
  font-size:20px;
  text-shadow:0 2px 8px #000,0 0 18px #ffb36d88
}
.ct-flash.good{animation:ctGoodStrong .42s ease}
@keyframes ctTileClearStrong{
  0%{transform:scale(1);opacity:1;filter:brightness(1)}
  32%{transform:scale(1.34);opacity:1;filter:brightness(1.7) saturate(1.3)}
  62%{transform:scale(.82) rotate(-8deg);opacity:.96;filter:brightness(1.4)}
  100%{transform:scale(.08) rotate(22deg);opacity:0;filter:brightness(2)}
}
@keyframes ctMatchLine{
  0%{opacity:0;clip-path:inset(0 100% 0 0)}
  24%{opacity:1}
  68%{opacity:1;clip-path:inset(0 0 0 0)}
  100%{opacity:0;clip-path:inset(0 0 0 0)}
}
@keyframes ctClearRing{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}
  35%{opacity:1}
  100%{opacity:0;transform:translate(-50%,-50%) scale(2.8)}
}
@keyframes ctGoodStrong{
  0%{opacity:0;background:transparent}
  42%{opacity:1;background:#ffffff0a;box-shadow:inset 0 0 70px #6dffae38}
  100%{opacity:0;background:transparent}
}


/* Clear FX performance/readability pass: 2026-09-20 */
.ct-fx-layer{contain:layout paint}
.ct-cell.is-clearing .ct-tile{
  animation:ctTileClearOptimized .30s cubic-bezier(.2,.72,.24,1) forwards!important;
  will-change:transform,opacity;
}
.ct-match-line{
  filter:none!important;
  animation:ctMatchLineOptimized .38s ease-out forwards!important;
  will-change:opacity;
}
.ct-match-line::before,.ct-match-line::after{
  box-shadow:0 0 6px var(--match-color,#ff7650)!important;
}
.ct-clear-ring{
  box-shadow:0 0 10px var(--match-color,#ff7650)!important;
  animation:ctClearRingOptimized .42s ease-out forwards!important;
  will-change:transform,opacity;
}
.ct-burst{
  width:8px!important;
  height:8px!important;
  box-shadow:none!important;
  animation:ctBurstOptimized .48s cubic-bezier(.16,.72,.28,1) forwards!important;
  will-change:transform,opacity;
}
.ct-score-pop{
  z-index:13;
  min-width:max-content;
  padding:6px 10px;
  border:1px solid #ffffff24;
  border-radius:999px;
  background:#0d1013d9;
  color:#fff5dc;
  font-size:clamp(22px,2.2vw,28px)!important;
  line-height:1;
  white-space:nowrap;
  text-shadow:0 2px 6px #000;
  box-shadow:0 6px 18px #0006;
  animation:ctScorePopReadable 1.5s ease-out forwards!important;
  will-change:transform,opacity;
}
.ct-flash.good{animation:ctGoodOptimized .28s ease-out!important}

@keyframes ctTileClearOptimized{
  0%{transform:scale(1);opacity:1}
  38%{transform:scale(1.13);opacity:1}
  100%{transform:scale(.12);opacity:0}
}
@keyframes ctMatchLineOptimized{
  0%{opacity:0}
  18%{opacity:1}
  72%{opacity:.9}
  100%{opacity:0}
}
@keyframes ctClearRingOptimized{
  0%{opacity:.95;transform:translate(-50%,-50%) scale(.45)}
  100%{opacity:0;transform:translate(-50%,-50%) scale(2.25)}
}
@keyframes ctBurstOptimized{
  0%{opacity:.95;transform:translate(-50%,-50%) scale(.72)}
  100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(.2)}
}
@keyframes ctScorePopReadable{
  0%{opacity:0;transform:translate(-50%,-30%) scale(.82)}
  12%{opacity:1;transform:translate(-50%,-52%) scale(1.05)}
  68%{opacity:1;transform:translate(-50%,-58%) scale(1)}
  100%{opacity:0;transform:translate(-50%,-92%) scale(.96)}
}
@keyframes ctGoodOptimized{
  0%{opacity:0;background:transparent}
  42%{opacity:.72;background:#8dffc20d}
  100%{opacity:0;background:transparent}
}

@media(prefers-reduced-motion:reduce){
  .ct-match-line,.ct-clear-ring,.ct-burst{display:none!important}
  .ct-cell.is-clearing .ct-tile{animation:none!important;opacity:.25}
  .ct-score-pop{animation:none!important;opacity:1;transform:translate(-50%,-55%)}
}


/* Tile discrimination and preview pass: 2026-09-20 */
.ct-tile{
  inset:8%!important;
  border-width:2px!important;
  border-color:var(--tile-edge,#ffffff66)!important;
  box-shadow:inset 0 1px 2px rgba(255,255,255,.38),0 2px 5px rgba(0,0,0,.62)!important;
}
.ct-tile .ct-face{
  width:104%!important;
  height:104%!important;
  transform:scale(1.06);
  filter:contrast(1.18) saturate(1.12) brightness(1.04) drop-shadow(0 1px 0 rgba(255,255,255,.24))!important;
}
.ct-tile::after{
  content:attr(data-mark);
  position:absolute;
  right:-1px;
  bottom:-1px;
  z-index:3;
  display:grid;
  place-items:center;
  min-width:15px;
  height:15px;
  padding:0 3px;
  border-radius:6px 0 5px 0;
  background:#0b0d11e8;
  border:1px solid rgba(255,255,255,.72);
  color:#fff;
  font:1000 9px/1 Arial,sans-serif;
  text-shadow:0 1px 1px #000;
  box-shadow:0 1px 3px #0008;
}
.type-0{--tile-edge:#4DE3A2;background:linear-gradient(145deg,#00724B,#00B875)!important}
.type-1{--tile-edge:#8FC4FF;background:linear-gradient(145deg,#153E9A,#2F80ED)!important}
.type-2{--tile-edge:#FF8CA1;background:linear-gradient(145deg,#98152E,#E63D59)!important}
.type-3{--tile-edge:#FFE58A;background:linear-gradient(145deg,#8B6700,#E9B923)!important}
.type-4{--tile-edge:#FFB07A;background:linear-gradient(145deg,#A54100,#F07824)!important}
.type-5{--tile-edge:#D3A7FF;background:linear-gradient(145deg,#56249A,#9B5DE5)!important}
.type-6{--tile-edge:#8BEAF1;background:linear-gradient(145deg,#006570,#18BFC9)!important}
.type-7{--tile-edge:#D6A375;background:linear-gradient(145deg,#56341E,#9A6137)!important}
.type-8{--tile-edge:#E7EEF3;background:linear-gradient(145deg,#4B535B,#A7B0B8)!important}
.type-9{--tile-edge:#FF9BD0;background:linear-gradient(145deg,#8D1D63,#E34E9D)!important}
.type-10{--tile-edge:#D2EF7B;background:linear-gradient(145deg,#496400,#93C83E)!important}

.ct-cell.is-preview-origin{
  z-index:4;
  background:rgba(111,197,255,.13)!important;
  box-shadow:inset 0 0 0 2px rgba(139,220,255,.68)!important;
}
.ct-cell.is-preview-origin::after{
  position:absolute;
  inset:18%;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#0b1a22dc;
  color:#d9f5ff;
  font-size:clamp(9px,1.1vw,14px);
  font-weight:1000;
  pointer-events:none;
}
.ct-cell.is-preview-valid::after{content:"✓";border:1px solid #74E6A5;color:#BFFFD5}
.ct-cell.is-preview-miss::after{content:"×";border:1px solid #FF806F;color:#FFC3BA}
.ct-cell.is-preview-match .ct-tile{
  z-index:5;
  transform:scale(1.17);
  border-color:#fff!important;
  box-shadow:0 0 0 2px var(--tile-edge,#fff),0 0 16px var(--tile-edge,#fff),0 4px 9px #000b!important;
}
.ct-cell.is-preview-match .ct-tile::before{
  content:"제거";
  position:absolute;
  left:50%;
  top:1px;
  z-index:4;
  transform:translateX(-50%);
  padding:2px 4px;
  border-radius:4px;
  background:#090b0de8;
  color:#fff;
  border:1px solid var(--tile-edge,#fff);
  font-size:7px;
  font-weight:1000;
  white-space:nowrap;
}
.ct-mini{
  position:relative;
  border-width:2px!important;
}
.ct-mini::after{
  content:attr(data-mark);
  position:absolute;
  right:1px;
  bottom:1px;
  min-width:12px;
  height:12px;
  display:grid;
  place-items:center;
  border-radius:4px;
  background:#090b0de8;
  color:#fff;
  font:900 8px/1 Arial,sans-serif;
}
@media(max-width:600px){
  .ct-tile{inset:7%!important;border-width:1px!important}
  .ct-tile::after{min-width:12px;height:12px;padding:0 2px;font-size:7px}
  .ct-cell.is-preview-match .ct-tile{transform:scale(1.1)}
  .ct-cell.is-preview-match .ct-tile::before{display:none}
}
@media(prefers-reduced-motion:reduce){
  .ct-cell.is-preview-match .ct-tile{transition:none!important}
}


/* 2026-09-20: Chunbong face tiles + simpler primary-color language.
   Normal hover never reveals a valid move; preview classes are reserved for Hint. */
.ct-tile::after,.ct-mini::after{display:none!important;content:none!important}
.ct-face{
  background-image:url('assets/chuncortile/tiles-user.webp')!important;
  background-size:400% 300%!important;
  background-repeat:no-repeat!important
}
.type-0{--tile-edge:#FF8A80;background:linear-gradient(145deg,#EF5350,#D32F2F)!important}
.type-1{--tile-edge:#82B1FF;background:linear-gradient(145deg,#42A5F5,#1565C0)!important}
.type-2{--tile-edge:#FFF176;background:linear-gradient(145deg,#FFEE58,#F9A825)!important}
.type-3{--tile-edge:#81C784;background:linear-gradient(145deg,#66BB6A,#2E7D32)!important}
.type-4{--tile-edge:#FFB74D;background:linear-gradient(145deg,#FFA726,#EF6C00)!important}
.type-5{--tile-edge:#CE93D8;background:linear-gradient(145deg,#AB47BC,#6A1B9A)!important}
.type-6{--tile-edge:#80DEEA;background:linear-gradient(145deg,#26C6DA,#00838F)!important}
.type-7{--tile-edge:#F48FB1;background:linear-gradient(145deg,#EC407A,#AD1457)!important}
.type-8{--tile-edge:#CFD8DC;background:linear-gradient(145deg,#B0BEC5,#607D8B)!important}
.type-9{--tile-edge:#9FA8DA;background:linear-gradient(145deg,#5C6BC0,#283593)!important}
.type-10{--tile-edge:#C5E1A5;background:linear-gradient(145deg,#9CCC65,#558B2F)!important}
.ct-cell.is-empty:hover{
  background:rgba(255,255,255,.035)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)!important
}
.ct-tile .ct-face,.ct-mini .ct-face{
  width:auto!important;
  height:88%!important;
  aspect-ratio:1/1;
  transform:none!important;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.42))!important
}


/* 2026-09-20 polish: compact score feedback and mobile touch target */
.ct-score-pop{
  padding:2px 6px!important;
  border-radius:999px!important;
  background:rgba(8,11,16,.78)!important;
  border:1px solid rgba(255,255,255,.16)!important;
  font-size:12px!important;
  line-height:1.1!important;
  letter-spacing:-.02em!important;
  white-space:nowrap!important;
  animation:ctScorePopCompact .78s ease-out forwards!important;
}
@keyframes ctScorePopCompact{
  0%{opacity:0;transform:translate(-50%,-30%) scale(.82)}
  22%{opacity:1;transform:translate(-50%,-50%) scale(1)}
  72%{opacity:.92;transform:translate(-50%,-64%) scale(.98)}
  100%{opacity:0;transform:translate(-50%,-82%) scale(.94)}
}
.ct-cell.is-touch-target{
  background:rgba(255,255,255,.12)!important;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.72),0 0 0 1px rgba(0,0,0,.28)!important;
}
