@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=DM+Serif+Display:ital@0;1&display=swap');
:root{--ink:#263c35;--paper:#f8f7ef;--green:#c7dd9e;--orange:#f17852}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif}.shell{max-width:1600px;margin:auto}header{height:93px;display:flex;align-items:center;justify-content:space-between;padding:0 7%;border-bottom:1px solid #dce0d3}.logo{font-size:26px;font-weight:700;letter-spacing:-1.7px;text-decoration:none;color:var(--ink)}.logo-mark{color:#ed7856;font-size:34px;vertical-align:-2px;margin-right:4px}.logo-dot,.section-top h2 span,.about h2 span{color:var(--orange)}nav{display:flex;align-items:center;gap:42px}nav a{color:var(--ink);text-decoration:none;font-size:13px;font-weight:700}.nav-button{background:var(--ink);color:white;padding:15px 20px;border-radius:6px}.nav-button span{margin-left:22px}.hero{padding:74px 7% 82px;display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}.eyebrow{font-size:10px;font-weight:700;letter-spacing:1.8px}.eyebrow span{color:var(--orange);font-size:16px;margin-right:7px}h1,h2,h3,p{margin:0}h1,h2{font-family:'DM Serif Display',Georgia,serif;font-weight:400;letter-spacing:-2px}h1{font-size:clamp(58px,6vw,92px);line-height:1.02;margin:23px 0}h1 em{color:#e87555;font-weight:400}.hero-copy>p{font-size:16px;line-height:1.8;max-width:430px;color:#617169}.primary{display:inline-flex;background:var(--ink);color:white;text-decoration:none;border:0;border-radius:6px;padding:18px 21px;font:700 13px 'DM Sans',sans-serif;cursor:pointer;margin-top:30px;gap:45px}.primary:hover,.nav-button:hover{background:#425c50}.hero-foot{font-size:9px;letter-spacing:1.4px;font-weight:700;margin-top:56px;color:#7c8a7c}.faces{color:#e87555;font-size:18px;letter-spacing:-4px;margin-right:15px}.hero-art{height:470px;background:#d9e7c4;border-radius:8px;position:relative;overflow:hidden;padding:28px}.art-label{font-size:10px;line-height:1.5;letter-spacing:1.5px;font-weight:700}.art-label span{float:right;font-size:20px}.art-circle{position:absolute;width:330px;height:330px;border:1px solid #9bb385;border-radius:50%;left:50%;top:51%;transform:translate(-50%,-50%)}.tile{position:absolute;width:118px;height:118px;border-radius:14px;display:grid;place-items:center;font-family:Georgia,serif;font-size:75px;box-shadow:0 8px 0 rgba(41,62,49,.1)}.t1{background:#f5a78a;left:39px;top:40px;transform:rotate(-12deg)}.t2{background:#f9edb2;left:166px;top:27px;transform:rotate(9deg)}.t3{background:#b5a8d5;left:32px;top:165px;transform:rotate(8deg)}.t4{background:#f7f4e9;left:160px;top:162px;transform:rotate(-9deg)}.art-spark{position:absolute;right:-36px;bottom:55px;color:#ee7957;font-size:65px}.art-bottom{position:absolute;bottom:28px;left:28px;right:28px;font-size:9px;font-weight:700;letter-spacing:1.4px;display:flex;justify-content:space-between}.art-bottom span{font-size:18px}.games{padding:80px 7% 100px;background:#fffefa}.section-top{display:flex;justify-content:space-between;align-items:end;margin-bottom:35px}.section-top h2,.about h2{font-size:clamp(38px,4vw,58px);line-height:1.08;margin-top:14px}.section-top>p{font-size:13px;line-height:1.7;color:#738078}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.game-card{border-radius:8px;overflow:hidden}.peach{background:#f8dbcd}.lavender{background:#e3ddef}.yellow{background:#f5edc4}.card-top{display:flex;justify-content:space-between;padding:22px;font-size:10px;letter-spacing:1.3px;font-weight:700}.illustration{height:210px;display:flex;align-items:center;justify-content:center}.word-art span{width:48px;height:57px;background:#fff9ed;border-radius:5px;display:grid;place-items:center;font-family:Georgia;font-size:33px;transform:rotate(-7deg);margin-left:-2px;box-shadow:0 4px #eab39c}.word-art span:nth-child(even){transform:rotate(7deg);background:#f39c7d}.word-art b{font-size:36px;color:#e87555;margin-left:10px}.memory-art{display:grid;grid-template-columns:repeat(2,64px);grid-template-rows:repeat(2,64px);gap:8px;align-content:center}.memory-art span{display:grid;place-items:center;background:#fbf8f2;border-radius:8px;font-size:35px;color:#b3a0d4}.memory-art span:nth-child(2),.memory-art span:nth-child(3){background:#b3a0d4;color:#fbf8f2}.slide-art{display:grid;grid-template-columns:repeat(3,46px);grid-template-rows:repeat(3,46px);gap:5px;align-content:center}.slide-art span{display:grid;place-items:center;background:#fff9dc;border-radius:5px;font-family:Georgia;font-size:25px}.slide-art span:last-child{background:#e7b955;color:#fff}.card-info{padding:22px;background:#fffefa;display:flex;align-items:center;justify-content:space-between;border:1px solid #e6e8dd;border-top:0;border-radius:0 0 8px 8px}.card-info h3{font-family:Georgia,serif;font-size:23px;font-weight:400}.card-info p{font-size:12px;color:#77847b;margin-top:8px}.card-info button,.close{width:42px;height:42px;border:1px solid #c9d0c5;background:transparent;color:var(--ink);border-radius:50%;font-size:20px;cursor:pointer}.card-info button:hover{background:var(--ink);color:white}.about{background:#dfe9d1;margin:0 7% 80px;padding:58px;display:grid;grid-template-columns:80px 1fr 1fr;gap:25px;align-items:center;border-radius:8px}.about-icon{font-size:65px;color:#ed7958}.about p{font-size:14px;line-height:1.8;color:#53675c;max-width:400px}.about strong{color:var(--ink)}footer{border-top:1px solid #dce0d3;padding:35px 7%;display:flex;justify-content:space-between;align-items:center}footer>span,footer>a:last-child{font-size:9px;letter-spacing:1.4px;font-weight:700;color:#78867a;text-decoration:none}dialog{border:0;border-radius:12px;background:#fffefa;color:var(--ink);width:min(560px,92vw);max-height:90vh;padding:32px;box-shadow:0 20px 80px #172b2460}dialog::backdrop{background:#203b30aa}.modal-head{display:flex;justify-content:space-between;align-items:start}.modal-head h2{font-size:43px;margin:8px 0}.close{font-size:29px}dialog>p{font-size:14px;line-height:1.6;color:#65756a}#game-area{margin-top:22px}#message{min-height:24px;margin-top:15px;color:var(--ink);font-weight:700}dialog .primary{margin-top:5px}.board{display:grid;gap:7px;width:max-content;max-width:100%;margin:auto}.word-board{grid-template-columns:repeat(5,46px)}.cell{width:46px;height:46px;border:2px solid #dce3d8;border-radius:5px;display:grid;place-items:center;font-size:21px;font-weight:700;text-transform:uppercase}.correct{background:#78a374;color:white;border-color:#78a374}.present{background:#e9be5d;color:#263c35;border-color:#e9be5d}.absent{background:#a7b2a8;color:white;border-color:#a7b2a8}.guess-form{display:flex;gap:8px;justify-content:center;margin-top:15px}.guess-form input{width:145px;padding:10px;border:1px solid #b8c7ba;border-radius:5px;font-size:16px;text-transform:uppercase}.guess-form button{background:var(--ink);color:white;border:0;border-radius:5px;padding:0 15px;cursor:pointer}.memory-board{grid-template-columns:repeat(4,65px)}.memory-board button,.slide-board button{border:0;border-radius:7px;cursor:pointer;color:var(--ink);font-size:29px}.memory-board button{height:65px;background:#c9bcdf}.memory-board button.revealed{background:#f5e7ca}.slide-board{grid-template-columns:repeat(3,70px)}.slide-board button{height:70px;background:#f3dda0;font-family:Georgia}.slide-board button.empty{background:#eef0e8}@media(max-width:800px){header{height:75px;padding:0 5%}nav{gap:15px}nav a:not(.nav-button){display:none}.hero{grid-template-columns:1fr;padding:55px 5%;gap:35px}.hero-foot{margin-top:30px}.hero-art{height:380px}.art-circle{transform:translate(-50%,-50%) scale(.83)}.games{padding:65px 5%}.section-top{display:block}.section-top>p{margin-top:18px}.cards{grid-template-columns:1fr}.illustration{height:190px}.about{margin:0 5% 55px;padding:35px;grid-template-columns:1fr;gap:15px}.about-icon{font-size:45px}footer{padding:25px 5%;gap:20px}footer>span{display:none}}

/* Keep game controls within narrow dialogs and respect completed-game state. */
.guess-form[hidden]{display:none}.word-board{grid-template-columns:repeat(5,minmax(0,46px))}.cell{width:100%;height:auto;aspect-ratio:1}.memory-board{grid-template-columns:repeat(4,minmax(0,65px))}.memory-board button{height:auto;aspect-ratio:1}.slide-board{grid-template-columns:repeat(3,minmax(0,70px))}.slide-board button{height:auto;aspect-ratio:1}
