:root{--cream:#f7f1e6;--paper:#fffdf8;--leaf:#506b45;--leaf-dark:#31482d;--terracotta:#b75f3c;--brown:#4b3125;--muted:#6f6259;--line:#ded1c0;--focus:#1557a6;--shadow:0 16px 42px rgba(75,49,37,.1)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--brown);font-family:"Noto Sans Thai","Leelawadee UI",Tahoma,Arial,sans-serif;line-height:1.75;overflow-x:hidden}
body.modal-open{overflow:hidden}
img{display:block;max-width:100%}
a{color:inherit}
button,a{touch-action:manipulation}
:focus-visible{outline:3px solid var(--focus);outline-offset:4px}
.skip-link{position:fixed;z-index:100;top:12px;left:12px;padding:10px 16px;background:#fff;border-radius:8px;transform:translateY(-160%)}
.skip-link:focus{transform:none}
.shell{width:min(1120px,calc(100% - 36px));margin-inline:auto}
.site-header{position:relative;z-index:5;border-bottom:1px solid rgba(75,49,37,.12);background:rgba(255,253,248,.94)}
.site-header__inner{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:Georgia,serif;font-size:1.05rem}
.brand__dot{width:14px;height:14px;border-radius:50%;background:#2265ad;box-shadow:0 0 0 5px rgba(34,101,173,.1)}
nav{display:flex;gap:20px}nav a{text-decoration:none;color:var(--muted);font-size:.95rem}nav a:hover{text-decoration:underline;text-underline-offset:4px}
.hero{padding:72px 0 64px;background:radial-gradient(circle at 80% 15%,rgba(183,95,60,.13),transparent 30%),linear-gradient(145deg,#fffdf8,#f3eadb)}
.hero__grid{display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:48px}
.eyebrow{margin:0 0 10px;color:var(--terracotta);font-size:.75rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
h1,h2,h3,p{overflow-wrap:anywhere}
h1,h2{font-family:Georgia,"Noto Serif Thai",serif;font-weight:400}
h1{margin:0;font-size:clamp(3.4rem,8vw,6.5rem);line-height:1;color:var(--leaf-dark)}
.hero__lead{max-width:620px;margin:24px 0 0;font-size:clamp(1.15rem,2.4vw,1.55rem);line-height:1.75;color:var(--muted)}
.button-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.button{display:inline-flex;min-height:46px;align-items:center;justify-content:center;padding:10px 18px;border:1px solid var(--leaf);border-radius:999px;text-decoration:none;font-weight:700;line-height:1.3}
.button--primary{background:var(--leaf);color:#fff}.button--primary:hover{background:var(--leaf-dark)}
.button--quiet{background:transparent;color:var(--leaf-dark)}.button--quiet:hover{background:#fff}
.hero__characters{position:relative;min-height:390px}
.hero__characters img{position:absolute;width:min(52%,240px);aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 18px 22px rgba(75,49,37,.13))}
.hero__characters img:nth-child(1){left:2%;bottom:10%;transform:rotate(-7deg)}
.hero__characters img:nth-child(2){right:2%;bottom:2%;transform:rotate(6deg)}
.hero__characters img:nth-child(3){left:29%;top:0;z-index:2}
.section{padding:84px 0}.prose{max-width:820px}.prose h2,.section-heading h2,.featured h2,.closing h2{margin:0;font-size:clamp(2rem,4vw,3.15rem);line-height:1.3;color:var(--leaf-dark)}
.prose>p:not(.eyebrow){font-size:1.1rem;color:var(--muted)}
.featured{background:var(--paper);border-block:1px solid var(--line)}
.featured__grid{display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;gap:64px}
.featured__art{min-height:370px;position:relative;background:radial-gradient(circle,rgba(80,107,69,.12),transparent 66%);border-radius:40px}
.featured__art img{position:absolute;object-fit:contain;filter:drop-shadow(0 12px 18px rgba(75,49,37,.1))}
.featured__art img:first-child{width:52%;top:7%;left:7%}.featured__art img:last-child{width:60%;right:1%;bottom:2%}
.featured__grid p:not(.eyebrow){font-size:1.08rem;color:var(--muted)}
.featured__list{padding-left:1.2rem;color:var(--leaf-dark)}
.catalog{background:#f2e9dc}.section-heading{max-width:740px;margin-bottom:28px}.catalog-status{margin:8px 0 0;color:var(--muted)}
.filters{display:flex;gap:10px;overflow-x:auto;padding:4px 4px 14px;margin:0 -4px 24px;scrollbar-width:thin}
.filter{flex:0 0 auto;border:1px solid #b8aa98;border-radius:999px;background:rgba(255,255,255,.6);color:var(--brown);padding:9px 15px;font:inherit;font-size:.92rem;cursor:pointer}
.filter:hover,.filter.is-active{background:var(--leaf);border-color:var(--leaf);color:#fff}
.sticker-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.sticker-card{display:flex;min-width:0;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:24px;background:var(--paper);box-shadow:0 7px 22px rgba(75,49,37,.06)}
.sticker-card[hidden]{display:none}
.card__image{display:grid;place-items:center;min-height:278px;padding:24px;background:linear-gradient(145deg,#f9f3e9,#efe3d2)}
.card__image img{width:220px;height:220px;object-fit:contain;filter:drop-shadow(0 10px 14px rgba(75,49,37,.09))}
.card__body{display:flex;flex:1;flex-direction:column;padding:24px}
.card__topline{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:13px}
.badge{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:.72rem;font-weight:700;letter-spacing:.04em;background:#e3ecdf;color:var(--leaf-dark)}
.badge--review{background:#fae6cf;color:#7d421f}.badge--archive{background:#eee8df;color:#62574f}
.card__meta{font-size:.78rem;color:var(--muted)}
.sticker-card h3{margin:0;color:var(--brown);font-size:1.25rem;line-height:1.45}.card__en{margin:4px 0 0;color:var(--terracotta);font-size:.88rem;font-weight:700;line-height:1.4}
.card__description{margin:14px 0 20px;color:var(--muted);font-size:.93rem;line-height:1.75}
.card__actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:auto}
.card__actions .button{min-height:42px;padding:8px 13px;font-size:.86rem}.button--preview{border-color:#b9aa98;background:transparent;color:var(--brown);cursor:pointer}.button--preview:hover{background:#f3eadf}
.button[aria-disabled="true"],.button:disabled{border-color:#c8bfb5;background:#e5ddd3;color:#756b63;cursor:not-allowed;opacity:.78}
.moments{background:var(--paper)}.moments__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.moments article{padding:24px;border-top:3px solid var(--terracotta);background:#f8f3eb}.moments article span{font-family:Georgia,serif;color:var(--terracotta);font-size:1.8rem}.moments h3{margin:10px 0 8px;font-size:1.05rem}.moments p{margin:0;color:var(--muted);font-size:.92rem}
.closing{text-align:center;padding:98px 0;background:var(--leaf-dark);color:#fff}.closing .eyebrow{color:#e7ad8d}.closing h2{color:#fff;margin-bottom:30px}.closing .button--primary{background:#fff;color:var(--leaf-dark);border-color:#fff}
.site-footer{padding:36px 0;text-align:center;background:#241b17;color:#eee5dc}.site-footer a{text-decoration:none;font-family:Georgia,serif;font-size:1.15rem}.site-footer p{margin:5px 0 0;color:#bdb2a8;font-size:.9rem}
.modal{position:fixed;z-index:50;inset:0;display:grid;place-items:center;padding:20px}.modal[hidden]{display:none}.modal__backdrop{position:absolute;inset:0;background:rgba(27,20,16,.78)}
.modal__dialog{position:relative;display:grid;grid-template-rows:auto minmax(0,1fr);width:min(900px,100%);max-height:calc(100vh - 40px);overflow:hidden;border-radius:24px;background:var(--paper);box-shadow:var(--shadow)}
.modal__heading{padding:22px 62px 18px 24px}.modal__heading h2{margin:0;color:var(--leaf-dark);font-size:1.55rem}.modal__heading p:last-child{margin:4px 0 0;color:var(--muted);font-size:.9rem}
.modal__close{position:absolute;z-index:2;top:14px;right:14px;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:#fff;color:var(--brown);font-size:1.8rem;line-height:1;cursor:pointer}
.modal__dialog>img{width:100%;height:100%;min-height:0;object-fit:contain;background:#eee5d8}
.noscript{padding:20px;border:1px solid var(--line);background:#fff}
@media(max-width:900px){.hero__grid,.featured__grid{grid-template-columns:1fr}.hero__characters{min-height:340px;max-width:620px;width:100%;margin:auto}.featured__art{min-height:360px}.sticker-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.moments__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.shell{width:min(100% - 28px,1120px)}.site-header__inner{align-items:flex-start;flex-direction:column;padding-block:14px}.site-header nav{width:100%;gap:14px;overflow-x:auto;padding-bottom:2px}.hero{padding:54px 0 44px}.hero__characters{min-height:270px}.section{padding:62px 0}.featured__art{min-height:290px}.sticker-grid{grid-template-columns:1fr}.card__image{min-height:240px}.moments__grid{grid-template-columns:1fr}.modal{padding:10px}.modal__dialog{max-height:calc(100vh - 20px);border-radius:18px}}
@media(max-width:390px){.button-row>.button{width:100%}.hero__characters{min-height:240px}.card__body{padding:20px}.filters{margin-right:-14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}