/* Merak Club: chunky lettering, cut-paper shapes and bold color. */
:root{--paper:#fff9e9;--ink:#282342;--accent:#ed593c;--fun:'Chalkboard SE','Comic Sans MS','Arial Rounded MT Bold',sans-serif}body{color:var(--ink)}header{margin:0;padding:0 4%;height:90px;background:#ffc54b;border-bottom:3px solid var(--ink)}.logo{font:bold 37px var(--fun);color:var(--ink);letter-spacing:-2px;transform:rotate(-3deg)}.logo span{color:#6640bb}.tagline{font:13px var(--fun);letter-spacing:0;color:#493750}.home-link{background:#fff9e9;border:2px solid var(--ink);border-radius:25px;padding:10px 17px;box-shadow:3px 3px 0 var(--ink);transform:rotate(2deg)}.hero{position:relative;margin:26px 0 0;padding:38px 3%;grid-template-columns:1.2fr 1fr;gap:5%;background:#e9dfff;border:3px solid var(--ink);border-radius:28px 7px;box-shadow:7px 7px 0 var(--ink)}.hero:after{content:'!';position:absolute;left:55%;top:-23px;width:57px;height:57px;background:#bce873;display:grid;place-items:center;font:bold 38px var(--fun);border:2px solid var(--ink);border-radius:50%;transform:rotate(14deg)}.hero .eyebrow{display:inline-block;font:11px var(--fun);letter-spacing:.3px;background:#fff9e9;color:var(--ink);padding:7px 12px;border:2px solid var(--ink);border-radius:4px;transform:rotate(-2deg)}.hero h1{font:bold clamp(48px,5.8vw,83px)/1.04 var(--fun);letter-spacing:-3px;margin:25px 0 19px;color:#282342}.hero h1 em{font-family:var(--fun);font-style:normal;color:#7045c1;text-shadow:2px 3px 0 #fff9e9;display:inline-block;transform:rotate(-3deg)}.hero p{color:#56476f}.browse-link{background:#f36a48;color:var(--ink);border:2px solid var(--ink);border-radius:8px;font:bold 15px var(--fun);box-shadow:4px 4px 0 var(--ink);transform:rotate(-2deg)}.browse-link:hover{background:#ff8667;box-shadow:1px 1px 0 var(--ink);transform:translate(3px,3px)}.pencil-note{font:16px var(--fun);color:#6745a1;transform:rotate(6deg)}.featured{border:3px solid var(--ink);background:#ffda57;border-radius:12px;box-shadow:5px 5px 0 var(--ink);padding:19px 22px;transform:rotate(4deg);margin:12px 8px 12px 0}.featured:before{top:-16px;background:#61d5b1cc;width:90px;height:28px;transform:rotate(-8deg)}.feature-top{font:11px var(--fun);letter-spacing:0;color:#443857}.feature-top span:last-child{border:2px solid var(--ink);border-radius:20px;background:#fff9e9;padding:3px 9px}.featured svg{margin:0;height:225px;filter:saturate(1.5)}.feature-bottom h2{font:bold 30px/1.08 var(--fun);letter-spacing:-1px;color:var(--ink)}.feature-arrow{display:grid;place-items:center;width:46px;height:46px;border:2px solid var(--ink);background:#f783ae;border-radius:50%;flex-shrink:0;color:var(--ink)}.catalog-bar{margin-top:42px}.catalog-bar h2{font:bold 35px var(--fun);color:var(--ink)}.catalog-bar h2:after{content:'17 deney';font:12px var(--fun);display:inline-block;vertical-align:middle;margin-left:15px;padding:6px 12px;background:#bce873;border:2px solid var(--ink);border-radius:50%;transform:rotate(-9deg);letter-spacing:0}.search{font:12px var(--fun)}.search input{background:white;border:2px solid var(--ink);border-radius:9px;padding:10px 13px;box-shadow:3px 3px 0 #d7c6ee}#filters{border:0;gap:9px;margin:15px 0 31px}#filters button,#filters button:first-child{padding:9px 17px;font:13px var(--fun);border:2px solid var(--ink);border-radius:7px;background:#fffdf7;color:var(--ink)}#filters button.active{background:#7049bd;color:white;box-shadow:3px 3px 0 var(--ink);transform:rotate(-3deg)}#cards{gap:27px}.card,.card:nth-child(n){--tone:#d9d0ff;border:2px solid var(--ink);border-radius:16px;background:#fffdf5;padding:0;overflow:hidden;box-shadow:4px 4px 0 var(--ink);transition:transform .16s}.card:nth-child(4n+2){--tone:#ffd682}.card:nth-child(4n+3){--tone:#afe8cd}.card:nth-child(4n){--tone:#ffc0cf}.card:before{content:attr(data-number);position:absolute;left:13px;top:12px;z-index:1;background:var(--tone);border:2px solid var(--ink);border-radius:50%;width:38px;height:38px;display:grid;place-items:center;font:bold 18px var(--fun);transform:rotate(-7deg)}.card:hover{transform:translate(-2px,-4px) rotate(-1deg);box-shadow:7px 8px 0 var(--ink);border-color:var(--ink)}.card canvas{border-bottom:2px solid var(--ink);filter:none!important}.card-info{padding:16px 20px 20px}.card small{font:10px var(--fun);color:#5b5275}.card h3{font:bold 21px/1.2 var(--fun);letter-spacing:-.6px;color:var(--ink);max-width:100%}.card p{color:#6b6381}.card .launch{font:bold 13px var(--fun);color:var(--ink);display:inline-block;background:var(--tone);border:1.5px solid var(--ink);padding:6px 13px;border-radius:22px}.card .launch:after{display:none}.experiment-heading h1{font:bold 33px var(--fun);color:#493782}.experiment-heading>span{font:12px var(--fun);background:#ffdc79;color:var(--ink);padding:7px 12px;border:1.5px solid var(--ink);border-radius:6px;transform:rotate(2deg)}.workbench{border:3px solid var(--ink);border-radius:18px;box-shadow:5px 5px 0 var(--ink)}.scene-top{background:#b8e7fa;border-bottom:2px solid var(--ink)}.scene-top>span{font:bold 12px var(--fun)}.scene-top button{font:12px var(--fun);border:1.5px solid var(--ink);border-radius:20px;background:#fffdf5;color:var(--ink)}aside{background:#fff0ad;border-left:2px solid var(--ink)}aside h2{font:bold 29px var(--fun);color:#a54434}.control label{font:13px var(--fun)}.control output{font:bold 13px var(--fun);color:#6a43b1}.control input[type=range]{accent-color:#744ac4}.control select{border:1.5px solid var(--ink);border-radius:7px;background:#fffaf0}.prediction b{font:bold 20px var(--fun)}.playbar{background:#6444a5}.playbar button{font:12px var(--fun);border:1.5px solid #292442;background:#9170ce;border-radius:7px}#reset{background:#ffc54b;color:var(--ink)}#metrics{border:2px solid #51677e;border-radius:9px;background:#fffef4}#metrics strong{font:bold 23px var(--fun);color:#6444a5}#metrics small{font:11px var(--fun)}.compare h2{font:bold 25px var(--fun);color:#6240a4}.compare button{font:13px var(--fun);border:2px solid var(--ink);border-radius:7px}#remember{background:#b8e481;color:var(--ink);box-shadow:3px 3px 0 var(--ink)}#guided summary{font:bold 14px var(--fun);color:#8154b1}#setups button{font:12px var(--fun);border-radius:5px}.next-nav{font:13px var(--fun)}footer{font:11px var(--fun);background:#ffc54b;border-top:3px solid var(--ink);margin:35px 0 0;padding:24px 4%;color:#463454}footer span{font:13px var(--fun)}.under .eyebrow{font:bold 12px var(--fun);color:#8153b4}
@media(max-width:1100px){.hero h1{font-size:60px}.featured svg{height:195px}.feature-bottom h2{font-size:27px}}@media(max-width:800px){.hero{gap:25px;grid-template-columns:1fr 1fr}.hero h1{font-size:48px}.hero .eyebrow{font-size:9px}.feature-bottom h2{font-size:23px}.featured svg{height:165px}#cards{gap:22px}.card h3{font-size:19px}.workbench aside{border-left:0;border-top:2px solid var(--ink)}}@media(max-width:540px){header{height:77px}.logo{font-size:30px}.home-link{font-size:10px;padding:8px 12px}.hero{grid-template-columns:1fr;padding:26px 6%;margin-top:18px;gap:29px;box-shadow:4px 4px 0 var(--ink)}.hero:after{left:auto;right:10px;top:-20px;width:42px;height:42px;font-size:27px}.hero h1{font-size:51px;letter-spacing:-2.5px}.featured{margin:0 4px 7px;transform:rotate(3deg);padding:16px}.featured svg{height:165px}.feature-bottom h2{font-size:26px}.pencil-note{display:block;font-size:15px;margin:18px 0 0 8px}.catalog-bar h2{font-size:29px}.catalog-bar h2:after{font-size:10px;padding:5px 9px;margin-left:10px}#filters{gap:7px}#filters button,#filters button:first-child{padding:8px 11px;font-size:11px}#cards{gap:18px 13px}.card,.card:nth-child(n){border-radius:10px;box-shadow:3px 3px 0 var(--ink)}.card:before{width:28px;height:28px;font-size:13px;left:7px;top:7px}.card-info{padding:12px 10px}.card h3{font-size:16px;letter-spacing:-.4px}.card small{font-size:8px}.card .launch{font-size:11px;padding:5px 9px}.experiment-heading h1{font-size:25px;clear:both;padding-top:10px}.experiment-heading>span{font-size:9px;padding:5px 8px}.workbench{border-width:2px;box-shadow:3px 3px 0 var(--ink)}#metrics strong{font-size:16px}#metrics small{font-size:9px}.compare h2{font-size:22px}.playbar button{font-size:11px}}@media(prefers-reduced-motion:reduce){.card{transition:none}}
