:root{--violet:#6740d9;--lilac:#c8b8ff;--cream:#fff8e8;--ink:#211646;--mint:#a9f3c9}*{box-sizing:border-box}body{margin:0;background:var(--violet);color:var(--cream);font-family:Rockwell,"Courier New",serif}main{min-height:100vh;max-width:680px;margin:auto;padding:max(1.2rem,env(safe-area-inset-top)) 1rem max(1.2rem,env(safe-area-inset-bottom))}header{display:flex;align-items:center;gap:.8rem}.logo{position:relative;width:48px;height:34px}.logo i{position:absolute;width:32px;height:32px;border:3px solid var(--cream);border-radius:50%}.logo i:last-child{left:16px;border-color:var(--mint)}header h1{font-size:1rem;line-height:.9;margin:0}header h1 b{color:var(--mint)}header p{font:700 .48rem Arial;letter-spacing:.14em;margin:.35rem 0}.pairs{margin-left:auto;display:flex;align-items:baseline}.pairs b{font-size:1.8rem;color:var(--mint)}.pairs span{font:700 .65rem Arial}.intro{padding-top:8vh}.sample{display:flex;gap:.6rem;transform:rotate(-3deg);margin-bottom:3rem}.sample span{width:48%;min-height:100px;padding:1rem;display:flex;align-items:center;justify-content:center;text-align:center;background:var(--cream);color:var(--ink);border-radius:10px;box-shadow:6px 7px 0 var(--ink);font:800 .75rem Arial}.sample span:last-child{background:var(--mint)}.intro h2,.done h2{font-size:clamp(2.8rem,11vw,5rem);line-height:.88;letter-spacing:-.06em;margin:.7rem 0}.intro p,.done p{font:400 1rem/1.5 Arial;max-width:510px}.intro button,.done button{border:0;background:var(--mint);color:var(--ink);padding:1rem 1.4rem;font:800 .75rem Arial;letter-spacing:.1em;margin-top:1rem;border-radius:99px}.hidden{display:none!important}.board{display:grid;grid-template-columns:repeat(4,1fr);gap:.55rem;padding-top:4vh}.card{border:0;background:transparent;padding:0;aspect-ratio:.78;perspective:600px}.card>span{position:relative;display:block;width:100%;height:100%;transform-style:preserve-3d;transition:transform .45s}.card.open>span,.card.matched>span{transform:rotateY(180deg)}.face{position:absolute;inset:0;backface-visibility:hidden;border-radius:9px;display:grid;place-items:center;padding:.45rem}.back{background:var(--lilac);color:var(--ink);font-size:1.7rem}.front{transform:rotateY(180deg);background:var(--cream);color:var(--ink);font:800 clamp(.48rem,1.7vw,.7rem)/1.18 Arial;word-break:break-word}.card.definition .front{background:var(--mint)}.card.matched .front{outline:4px solid #fff}.done{padding-top:14vh;text-align:center}.rings{height:130px;position:relative}.rings i{position:absolute;width:130px;height:130px;border:10px solid var(--cream);border-radius:50%;left:calc(50% - 90px)}.rings i:last-child{left:calc(50% - 40px);border-color:var(--mint)}.done>p:first-of-type{font:700 .6rem Arial;letter-spacing:.16em}.done #done-score{font-size:3rem;color:var(--mint)}@media(max-width:460px){.board{grid-template-columns:repeat(4,1fr);gap:.35rem}.face{padding:.25rem}.front{font-size:.44rem}}