@font-face{font-family:"Arun Sans";src:url("sans-400-0.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Arun Sans";src:url("sans-600-1.woff2") format("woff2");font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:"Arun Serif";src:url("serif-500-2.woff2") format("woff2");font-style:normal;font-weight:500;font-display:swap}
:root{--forest:#0b211a;--forest-2:#123329;--paper:#fffdf7;--cream:#f2eee3;--cream-2:#e5ddcc;--gold:#ddb457;--gold-soft:#f3d998;--ink:#10251d;--muted:#627168;--sans:"Arun Sans","Noto Sans Thai",system-ui,sans-serif;--serif:"Arun Serif","Noto Serif Thai",serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--cream)}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6;overflow-x:hidden}
a{color:inherit}
img,svg{display:block;max-width:100%}
button,a{-webkit-tap-highlight-color:transparent}
.play-shell{width:min(1280px,calc(100% - 48px));margin-inline:auto}
.games-index{padding:1.1rem 0 clamp(4rem,8vw,7rem)}
.games-index__header{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-bottom:1rem}
.games-index__eyebrow{margin:0 0 2px;color:#7b6a40;font-size:.68rem;font-weight:600;letter-spacing:.19em}
.games-index h1{margin:0;font-family:var(--serif);font-size:clamp(2.6rem,4.2vw,4.1rem);font-weight:500;line-height:1;letter-spacing:-.04em}
.games-index__summary{display:flex;align-items:baseline;gap:12px;margin:0;padding-bottom:7px;color:#44554c}
.games-index__summary strong{color:var(--ink);font-family:var(--serif);font-size:1.55rem;font-weight:500}
.games-index__summary span{font-size:.82rem}
.games-list{display:grid;gap:24px}
.game-card{position:relative;display:grid;overflow:hidden;border:1px solid rgba(16,37,29,.16);border-radius:24px;box-shadow:0 18px 55px rgba(34,42,35,.08)}
.game-card--winner{grid-template-columns:minmax(420px,.95fr) minmax(460px,1.05fr);grid-template-areas:"media content";background:var(--forest);color:#f8f0df;border-color:rgba(221,180,87,.52)}
.game-card--kaprao{grid-template-columns:minmax(460px,1.05fr) minmax(420px,.95fr);grid-template-areas:"content media";background:var(--paper);color:var(--ink)}
.game-card__content{grid-area:content;display:flex;min-width:0;flex-direction:column;align-items:flex-start;padding:clamp(1.6rem,2.8vw,2.6rem)}
.game-card__number{display:flex;width:100%;align-items:center;justify-content:space-between;gap:16px;margin:0 0 1rem;padding-bottom:11px;border-bottom:1px solid currentColor;font-size:.62rem;letter-spacing:.17em;opacity:.68}
.game-card__number b{font-weight:400}
.event-proof{width:100%;margin-bottom:.9rem}
.event-logo-frame{display:flex;width:min(100%,320px);height:62px;gap:6px;overflow:hidden;border:1px solid rgba(255,255,255,.24);border-radius:10px;background:#f4f4f4}
.event-logo-mark,.event-logo-words{position:relative;display:block;overflow:hidden}
.event-logo-mark{flex:0 0 66px;border-right:1px solid #dedede}
.event-logo-words{flex:1 1 auto}
.event-logo-frame img{position:absolute;max-width:none;height:auto}
.event-logo-mark img{top:-16px;left:-10px;width:217px}
.event-logo-words img{top:-13px;left:-28px;width:700px}
.award-proof{display:flex;align-items:center;gap:12px;margin-top:11px}
.award-proof>span{display:grid;width:44px;height:44px;flex:0 0 44px;place-items:center;border-radius:50%;background:var(--gold);color:var(--forest);font-family:var(--serif);font-size:1rem;box-shadow:0 0 0 5px rgba(221,180,87,.11)}
.award-proof div{display:grid;gap:0}
.award-proof strong{font-size:.9rem;font-weight:600}
.award-proof small{color:var(--gold-soft);font-size:.78rem;font-weight:600;line-height:1.35;letter-spacing:.02em}
.event-proof>p{margin:7px 0 0 56px;color:#c2cec6;font-size:.75rem;letter-spacing:.03em}
.game-card__kicker{margin:.5rem 0;color:#8a6926;font-size:.7rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase}
.game-card h2{margin:.15rem 0 .8rem;font-family:var(--serif);font-size:clamp(2.8rem,4.4vw,4.8rem);font-weight:500;line-height:1.02;letter-spacing:-.05em}
.game-card h2 span,.game-card h2 small{display:block}
.game-card h2 small{margin:.3rem 0 0 clamp(1rem,2.5vw,2.4rem);font-size:.52em;font-weight:500;line-height:1}
.game-card--winner h2 small{color:var(--gold)}
.game-card--kaprao h2 small{color:#8d6224}
.game-card__description{max-width:610px;margin:0;color:inherit;font-size:.94rem;opacity:.82}
.game-tags{display:flex;flex-wrap:wrap;gap:8px;margin:1rem 0 0;padding:0;list-style:none}
.game-tags li{padding:6px 11px;border:1px solid currentColor;border-radius:999px;font-size:.66rem;opacity:.72}
.game-card__actions{display:flex;width:100%;align-items:center;gap:22px;margin-top:1.15rem}
.game-cta{display:flex;min-height:56px;min-width:250px;align-items:center;justify-content:space-between;gap:22px;padding:0 20px;border:1px solid var(--gold);background:var(--gold);color:var(--forest);font-size:.87rem;font-weight:600;text-decoration:none;transition:transform .2s ease,background .2s ease,color .2s ease}
.game-cta:hover{transform:translateY(-2px)}
.game-card--kaprao .game-cta{background:var(--forest);color:#fff7e6;border-color:var(--forest)}
.game-secondary{padding:8px 0;border-bottom:1px solid currentColor;font-size:.75rem;text-decoration:none;opacity:.78;transition:color .2s ease,opacity .2s ease}
.game-secondary:hover{color:var(--gold);opacity:1}
.game-cta:focus-visible,.game-secondary:focus-visible{outline:3px solid var(--gold);outline-offset:4px}
.game-card--kaprao .game-cta:focus-visible{outline-color:var(--forest)}
.game-cta b{font-size:1.25rem;font-weight:400}
.game-card__media{grid-area:media;display:flex;min-width:0;flex-direction:column;justify-content:center;margin:0;padding:clamp(1.5rem,3vw,2.6rem)}
.game-card--winner .game-card__media{background:linear-gradient(145deg,#d7b86f 0%,#e9ce8e 52%,#bd8b43 100%);color:var(--forest)}
.game-card--kaprao .game-card__media{background:linear-gradient(145deg,#ead9b1 0%,#f6ead0 55%,#d8b774 100%);color:var(--ink)}
.game-art{overflow:hidden;border:7px solid currentColor;background:var(--forest);box-shadow:14px 16px 0 rgba(11,33,26,.13)}
.game-art__image{width:100%;height:auto}
.game-art__svg{width:100%;height:auto;aspect-ratio:7/5}
.game-card__media figcaption{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:22px;padding-top:14px;border-top:1px solid rgba(11,33,26,.28);font-size:.66rem;letter-spacing:.08em}
.play-footer{padding:38px 0;background:var(--forest);color:#d8dfd8;border-top:1px solid rgba(221,180,87,.2)}
.play-footer__inner{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:32px}
.play-footer__brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.play-footer__brand img{width:44px;height:44px}
.play-footer__brand span{display:flex;flex-direction:column;color:#f2d59e;font-family:var(--serif)}
.play-footer__brand small{color:#9aaba1;font-family:var(--sans);font-size:.48rem;letter-spacing:.17em}
.play-footer p{margin:0;color:#8fa097;font-size:.74rem;text-align:center}
.play-footer nav{display:flex;justify-content:flex-end;gap:22px}
.play-footer nav a{color:#aab8b0;font-size:.72rem;text-decoration:none}
.play-footer nav a:hover{color:var(--gold)}
@media(max-width:960px){
  .game-card--winner,.game-card--kaprao{grid-template-columns:1fr;grid-template-areas:"content" "media"}
  .game-card__media{padding-top:0}
  .play-footer__inner{grid-template-columns:1fr auto}
  .play-footer p{display:none}
}
@media(max-width:640px){
  .play-shell{width:calc(100% - 24px)}
  .games-index{padding:1.15rem 0 3.5rem}
  .games-index__header{align-items:flex-start;flex-direction:column;gap:7px;margin-bottom:1rem;padding-inline:4px}
  .games-index__eyebrow{font-size:.59rem}
  .games-index h1{font-size:2.65rem}
  .games-index__summary{gap:9px;padding:0}.games-index__summary strong{font-size:1.22rem}.games-index__summary span{font-size:.72rem}
  .games-list{gap:16px}
  .game-card{border-radius:16px}
  .game-card__content{padding:20px 20px 24px}
  .game-card__number{margin-bottom:15px}
  .event-logo-frame{width:min(100%,320px);height:58px}
  .award-proof{margin-top:13px}
  .award-proof>span{width:40px;height:40px;flex-basis:40px}
  .award-proof strong{font-size:.81rem}.award-proof small{font-size:.75rem}
  .event-proof>p{margin-left:0;font-size:.75rem}
  .game-card h2{font-size:clamp(2.8rem,13.5vw,4rem);margin-bottom:.85rem}
  .game-card__description{font-size:.88rem;line-height:1.62}
  .game-tags{gap:6px;margin-top:1.05rem}.game-tags li{padding:5px 9px;font-size:.59rem}
  .game-card__actions{align-items:stretch;flex-direction:column;gap:11px;margin-top:1.25rem}
  .game-cta{width:100%;min-width:0;min-height:56px}
  .game-secondary{align-self:flex-start}
  .game-card__media{padding:0 16px 22px}
  .game-art{border-width:5px;box-shadow:8px 9px 0 rgba(11,33,26,.13)}
  .game-card__media figcaption{margin-top:16px;padding-top:11px;font-size:.57rem}
  .play-footer__inner{display:flex;flex-direction:column;align-items:flex-start;gap:22px}
  .play-footer nav{flex-wrap:wrap;justify-content:flex-start}
}
@media(max-width:360px){
  .event-logo-mark{flex-basis:54px}
  .event-logo-mark img{top:-7px;left:-8px;width:170px}
  .event-logo-words img{top:-7px;left:-22px;width:550px}
  .award-proof small{font-size:.75rem}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{transition-duration:.01ms!important}
}
@media(forced-colors:active){.game-card,.game-cta,.game-art{border:2px solid CanvasText}}
