html,body,.jspsych-display-element{background:white;color:#151515;margin:0;font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif}
*{box-sizing:border-box} .setup{max-width:760px;margin:5vh auto;padding:24px 32px 60px}h1{font-size:30px;line-height:1.6}p{line-height:1.8}label{display:block;margin:16px 0;font-size:17px}input,select{display:block;width:100%;font:17px "Microsoft YaHei",sans-serif;padding:10px;margin-top:7px;border:1px solid #aaa;background:white}
button,.button{display:inline-block;font:18px "Microsoft YaHei",sans-serif;background:white;color:#171717;border:1px solid #444;padding:13px 18px;margin:10px 8px 10px 0;cursor:pointer;text-decoration:none}button:disabled{opacity:.5;cursor:wait}.primary{background:#202b3b;color:white;width:100%}.grid{display:grid;grid-template-columns:1fr 1fr;gap:0 22px}.small{font-size:14px;color:#555;line-height:1.8}.error{color:#a12626;white-space:pre-wrap}.check{display:flex;align-items:center;gap:10px}.check input{width:auto;margin:0}details{margin:20px 0}summary{cursor:pointer}.lab{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:95vh;width:100%;text-align:center;padding:20px}.lab h1{font-size:36px}.lab p{font-size:26px;line-height:1.9;max-width:1000px}.lab .small{font-size:18px}.fix{font-size:50px}.stage{position:relative;display:flex;align-items:center;justify-content:center;width:450px;height:380px}.face{width:350px;height:350px;object-fit:contain}.cue{font-size:30px;line-height:1.5;border:2px solid #333;padding:6px 26px;min-width:230px;height:62px}.cue.emotion{border-radius:30px}.cue.gender{border-radius:0;border-style:double;border-width:4px}.hint{font-size:21px;height:70px;line-height:1.8}.key{display:inline-block;border:2px solid #333;padding:0 10px;margin:0 6px;font:24px Arial}table{border-collapse:collapse;width:100%;font-size:14px}th,td{padding:9px;border-bottom:1px solid #ccc;text-align:left}.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.gallery img{width:100%;object-fit:contain}.gallery label{font-size:13px}.gallery select{font-size:14px}.wide{max-width:1100px}.jspsych-content{width:100%;max-width:none}.jspsych-content-wrapper{display:block}#notice{min-height:24px}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #3768a5}@media(max-width:700px){.grid{grid-template-columns:1fr}.gallery{grid-template-columns:repeat(2,1fr)}.stage{width:90vw}.lab p{font-size:22px}.setup{padding:20px}}
/* Participant pages: compact entry and a single, clearly ranked instruction screen. */
.compact-entry{max-width:650px;margin:5vh auto;padding:24px 32px 40px}
.compact-entry h1{text-align:center;font-size:28px;margin:18px 0 28px}
.compact-entry .primary{margin:12px 0 0;padding:13px 18px}
.compact-entry #notice:empty{display:none}
.instruction-page{min-height:100svh;padding:24px;gap:20px}
.instruction-page h1{font-size:32px;line-height:1.35;margin:0}
.instruction-rules{display:grid;grid-template-columns:1fr 1fr;gap:24px;width:min(780px,100%)}
.rule-card{padding:18px 12px;border:1px solid #ccc;border-radius:3px}
.rule-label{font-size:21px;line-height:1.6;margin-bottom:8px}
.rule-keys{font-size:25px;font-weight:600;line-height:1.6}
.response-red{color:#b73333;font-weight:700}
.instruction-page p.instruction-focus{font-size:23px;line-height:1.5;margin:0}
.instruction-page p.instruction-note{font-size:17px;line-height:1.5;color:#555;margin:0}
.instruction-actions{display:flex;gap:12px;align-items:center}
.instruction-actions button{margin:0}
.quiet-button{border-color:transparent;color:#555;font-size:16px}
.instruction-page>button{margin:0}
.hint{height:48px;display:flex;align-items:center;justify-content:center}
@media(max-height:700px){.instruction-page{gap:14px;padding:16px}.instruction-page h1{font-size:28px}.rule-card{padding:12px}.rule-label{font-size:19px}.rule-keys{font-size:23px}.instruction-page p.instruction-focus{font-size:21px}}
@media(max-width:600px){.instruction-rules{grid-template-columns:1fr;gap:12px}.instruction-page{gap:14px}.rule-card{padding:10px}.rule-label{font-size:18px}.rule-keys{font-size:22px}.instruction-page p.instruction-focus{font-size:19px}.instruction-page h1{font-size:27px}}
.trial-question{font-size:30px;line-height:1.5;text-align:center}
.face-screen{gap:16px}
.response-screen{gap:32px}
.response-options{font-size:30px;line-height:1.6}
@media(max-height:650px){.face-screen .stage{height:320px}.face-screen .face{width:300px;height:300px}.trial-question,.response-options{font-size:26px}}
