:root{--navy:#111e38;--pink:#e8b5ad;--gold:#c0a46c;--cream:#f8f6f1;--line:#dfdfd8;--muted:#687180}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--navy);font:15px/1.6 Arial,sans-serif}button,select{font:inherit;cursor:pointer}button{border:0}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #9d6843;outline-offset:4px}header{max-width:1360px;margin:auto;padding:26px 52px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:inherit;font-size:13px;font-weight:700;letter-spacing:1.5px}.brand small{display:block;font-size:8px;letter-spacing:2px;color:var(--muted);margin-top:3px}.crest{border:1px solid var(--gold);padding:12px 8px;font:21px Georgia,serif;border-radius:2px 2px 14px 14px}.quiet{background:none;color:var(--navy);padding:9px 0;font-size:13px}.intro{padding:58px 0 37px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700}.intro>.eyebrow{display:flex;justify-content:space-between}.intro>.eyebrow span{color:var(--muted)}main{max-width:1160px;margin:auto;padding:0 30px}h1{font:normal clamp(50px,6.3vw,84px)/1.04 Georgia,serif;letter-spacing:-3px;margin:27px 0}em{font-weight:normal;color:#a66b62}h1 em{color:#a96c63}.intro-bottom{display:flex;justify-content:space-between;align-items:end}.intro-bottom p{color:var(--muted);margin:0;line-height:1.6}.meta{display:flex;gap:19px;font-size:9px;font-weight:700;letter-spacing:1.3px}.workspace{display:grid;grid-template-columns:210px 1fr;border-top:1px solid var(--line);padding-top:32px;gap:36px}aside{border-right:1px solid var(--line);padding-right:25px}.case-nav{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:23px}.case-nav button{height:36px;background:transparent;border:1px solid var(--line);font-size:12px;color:var(--muted)}.case-nav .active{background:var(--navy);color:white;border-color:var(--navy)}.case-nav .done:not(.active){background:#e3e9df;color:#334d3c}.aside-note{margin-top:50px;border-top:1px solid var(--line);padding-top:24px}.aside-note>span{font-size:8px;letter-spacing:1.8px;color:var(--muted)}.aside-note p{font:21px/1.5 Georgia,serif}.case-top{display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:1.8px;font-weight:700;margin-bottom:18px}.badge{background:#e9ebe5;padding:4px 11px;border-radius:20px;letter-spacing:.4px;font-weight:400}.timer-row{display:flex;align-items:center;gap:15px;margin-bottom:18px}.timer-row>div{display:flex;align-items:center;gap:10px;margin-right:auto}.tiny{font-size:9px;letter-spacing:1.5px;color:var(--muted)}#clock{font-size:15px;font-weight:400;font-variant-numeric:tabular-nums}select{border:1px solid var(--line);padding:5px;background:transparent;color:var(--navy);font-size:11px}article{background:#fff;border:1px solid var(--line);padding:32px 35px}h2{font:normal 34px/1.2 Georgia,serif;margin:0 0 25px;letter-spacing:-.7px}.file-label{font-size:9px;font-weight:700;letter-spacing:1.6px;color:var(--muted);display:flex;align-items:center;gap:8px}.folder{font-size:23px;color:var(--gold)}#scenario{font-size:16px;line-height:1.8;margin:18px 0 26px}h3{font-size:13px;margin:0 0 16px}#options{display:grid;gap:10px}.option{width:100%;display:flex;text-align:left;align-items:center;gap:14px;border:1px solid var(--line);padding:12px 15px;background:white;color:var(--navy);font-size:13px;line-height:1.5}.option .letter{display:grid;place-items:center;border:1px solid var(--line);width:27px;height:27px;flex-shrink:0;font-size:11px}.option:hover:not(:disabled){background:#f7f4ef;border-color:var(--gold)}.option.selected{border-color:var(--navy);background:#f0f2f5}.option.selected .letter{background:var(--navy);color:white;border-color:var(--navy)}.option.correct{border-color:#68846a;background:#edf3ed}.option.wrong{border-color:#b8776b;background:#fbefec}.option:disabled{cursor:default;opacity:1}.actions{display:flex;align-items:center;gap:10px;margin-top:20px;justify-content:space-between}.primary{background:var(--navy);color:white;padding:14px 23px;font-size:12px;letter-spacing:.3px}.primary:disabled{opacity:.4;cursor:default}.primary span{margin-left:28px}.progress{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;margin:24px 0 9px}.track{height:3px;background:#e1e2dd}.track i{display:block;height:100%;background:var(--gold);transition:width .3s}#feedback:not(:empty){margin-top:25px;border-top:1px solid var(--line);padding-top:22px}.verdict{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;color:#46634a}#feedback h3{font:24px Georgia,serif;margin:8px 0 12px}#feedback p{font-size:13px;line-height:1.7}#feedback dl{background:var(--cream);padding:17px;margin-bottom:0}dt{font-size:9px;letter-spacing:1px;text-transform:uppercase;font-weight:700;margin-top:10px}dt:first-child{margin-top:0}dd{margin:4px 0 0;font-size:12px;color:#505a69}.guide{margin-top:55px;background:#ede9e1;padding:35px}.guide h2{margin-top:12px}.guide p{font-size:13px;max-width:850px}.three{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin:28px 0}.three b{font:26px Georgia;color:#a66b62}.three h3{margin:10px 0}.closing{padding:65px 0 45px;text-align:center}.closing .eyebrow{color:var(--muted)}blockquote{max-width:760px;margin:22px auto;font:28px/1.5 Georgia,serif}footer{border-top:1px solid var(--line);padding:25px 0 35px}footer>span{font-size:9px;letter-spacing:1.5px}footer p,footer small{font-size:10px;color:var(--muted);line-height:1.7}footer a{color:var(--navy)}footer small{display:block}#summary{padding:30px;background:var(--navy);color:white;margin-top:25px}#summary h2{color:var(--pink);margin:10px 0}#summary button{background:var(--pink);color:var(--navy);padding:10px 17px}#summary p{font-size:13px}[hidden]{display:none!important}@media(max-width:750px){header{padding:18px 22px}.brand{font-size:10px;gap:9px}.brand small{font-size:6px}main{padding:0 21px}.intro{padding-top:35px}.intro>.eyebrow span{display:none}.intro-bottom{display:block}.meta{margin-top:23px;gap:18px}.workspace{grid-template-columns:1fr;gap:18px;padding-top:22px}aside{border:0;padding:0}.case-nav{grid-template-columns:repeat(12,1fr);gap:4px;margin-top:12px}.case-nav button{height:28px;font-size:10px}.aside-note,aside>.eyebrow{display:none}article{padding:25px 20px}h2{font-size:29px}#scenario{font-size:15px}.three{grid-template-columns:1fr;gap:15px}.guide{padding:25px}.intro h1{letter-spacing:-2px}blockquote{font-size:23px}.timer-row{gap:9px}.timer-row .quiet{font-size:11px}}
/* SFU's playful field-lab refresh */
:root{--navy:#201c57;--pink:#f2acae;--gold:#d3af5c;--cream:#fffafa;--line:#eadfe7;--muted:#716d88}body{background:radial-gradient(ellipse at 95% 9%,#fce1e8 0,transparent 32%),radial-gradient(ellipse at 0 35%,#eeeaff 0,transparent 35%),var(--cream);font-family:ui-rounded,'Trebuchet MS',Arial,sans-serif}header{border-bottom:0;padding-top:15px;padding-bottom:15px}.brand{gap:14px}.logo-window{display:block;width:200px;height:63px;overflow:hidden;background:white;border-radius:16px;position:relative}.logo-window img{position:absolute;left:0;top:-65px;width:200px;height:200px}.brand-caption{border-left:1px solid #d8cadc;padding-left:17px;font-size:11px}.hero-layout{display:flex;align-items:center;justify-content:space-between;gap:30px}.hero-pill{display:inline-block;border-radius:30px;padding:7px 14px;background:#f5dce6;font-size:9px;font-weight:bold;letter-spacing:1.3px;margin-top:25px}h1{font-family:ui-rounded,'Trebuchet MS',Arial,sans-serif;font-weight:900;letter-spacing:-4px;font-size:clamp(48px,6.2vw,80px);margin:23px 0 28px}h1 em{font-style:normal;color:#b35172;background:linear-gradient(transparent 75%,#f5c9d6 75%);border-radius:5px}.hero-bubble{position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:center;justify-content:center;width:265px;height:265px;flex-shrink:0;border-radius:45% 55% 58% 42% / 46% 46% 54% 54%;background:var(--navy);color:white;transform:rotate(6deg);box-shadow:15px 15px 0 #e9daee;margin-right:25px}.hero-bubble strong{font-size:24px;line-height:1.2;text-align:center;letter-spacing:-.7px}.bubble-icon{font:bold 90px/1 Arial;color:var(--pink);transform:rotate(-15deg)}.bubble-star{position:absolute;right:-12px;top:2px;font-size:68px;color:var(--gold);text-shadow:2px 2px white}.bubble-sticker{position:absolute;bottom:0;left:-35px;border-radius:25px;transform:rotate(-13deg);padding:10px 17px;background:var(--pink);color:var(--navy);font-size:11px;font-weight:bold;box-shadow:0 5px 0 #d48b9b}.meta span{background:white;border:1px solid var(--line);border-radius:25px;padding:7px 12px}.rally{display:flex;justify-content:space-around;gap:15px;background:var(--navy);border-radius:18px;padding:15px;margin:0 0 30px;color:#f4c0cf;font-size:10px;font-weight:bold;letter-spacing:1.3px}.workspace{border-top:0;padding-top:0}aside{border-right:0}.case-nav{gap:9px}.case-nav button{border-radius:12px;background:white;transition:transform .18s,box-shadow .18s}.case-nav button:hover{transform:translateY(-3px);box-shadow:0 4px 0 #e9deed}.case-nav .active{box-shadow:0 4px 0 #bc96b4}.case-nav .done:not(.active){background:#dcefe8}.aside-note{border-radius:20px;background:#f1eaf6;border:0;padding:22px 17px}.aside-note p{font-family:inherit;font-size:18px;font-weight:bold}.aside-note em{color:#ab4f70}.badge{background:#f8dce5;color:#843c5b;font-weight:bold;padding:5px 14px}article{border-radius:26px;border:1px solid #e9dfe9;box-shadow:0 10px 35px #44316b09;border-top:6px solid #eeacbd}h2{font-family:inherit;font-weight:800;letter-spacing:-1px}.timer-row{background:#eeeafa;border-radius:16px;padding:10px 15px}.timer-row select{border-radius:9px;background:white;border:0;padding:7px}.option{border-radius:15px;padding:13px 16px;transition:transform .18s,background .18s,box-shadow .18s}.option .letter{border-radius:9px;background:#f3eef8;color:var(--navy);border:0;font-weight:bold}.option:hover:not(:disabled){background:#fff2f6;transform:translateX(4px);border-color:#db96af;box-shadow:0 3px 0 #f4d8e3}.option.selected{background:#eeebfb;border:2px solid var(--navy);padding:12px 15px}.option.correct{background:#e6f5ec;border-color:#5b8c70}.option.wrong{background:#fff0ec;border-color:#b8776b}.primary{border-radius:30px;box-shadow:0 4px 0 #bba4c7;font-weight:bold;transition:transform .15s,box-shadow .15s}.primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 0 #bba4c7}.primary:active:not(:disabled){transform:translateY(2px);box-shadow:0 2px 0 #bba4c7}.track,.track i{height:7px;border-radius:10px}.track i{background:linear-gradient(90deg,#d3af5c,#ef9db8)}#feedback dl{border-radius:15px;background:#f5f0f9}#feedback h3{font-family:inherit;font-size:22px;font-weight:bold}.guide{border-radius:25px;background:#f2e8f1}.three>div{background:white;border-radius:18px;padding:20px}.three b{display:grid;place-items:center;width:43px;height:43px;border-radius:50%;background:#f8dce5;font: bold 18px Arial;color:var(--navy)}.closing blockquote{font-family:inherit;font-weight:700;font-size:25px}.closing em{color:#ad4f73}#summary{border-radius:24px}#summary h2{font-size:45px}#summary button{border-radius:30px}.celebration{position:fixed;inset:0;pointer-events:none;z-index:10;overflow:hidden}.confetti{position:absolute;top:-20px;width:11px;height:17px;border-radius:4px;animation:party 1.7s ease-in forwards}@keyframes party{to{transform:translateY(105vh) rotate(640deg);opacity:.1}}@media(max-width:750px){.logo-window{width:145px;height:47px}.logo-window img{width:145px;height:145px;top:-47px}.brand-caption{font-size:9px;padding-left:10px}.brand small{letter-spacing:1px}.hero-layout{gap:0}.hero-bubble{width:125px;height:140px;margin-right:0;box-shadow:7px 7px 0 #e9daee}.bubble-icon{font-size:50px}.hero-bubble strong{font-size:13px}.bubble-star{font-size:35px;right:-5px}.bubble-sticker{left:-15px;font-size:6px;padding:7px 8px;bottom:-8px}h1{font-size:49px!important;letter-spacing:-2.5px!important}.hero-pill{font-size:7px;padding:6px 9px;letter-spacing:.5px}.intro{padding-top:20px}.hero-layout>div:first-child{position:relative;z-index:1}.meta{gap:6px;font-size:8px}.meta span{padding:5px 8px}.rally{padding:12px 8px;gap:5px;font-size:7px;letter-spacing:.3px;border-radius:13px}.case-nav button{border-radius:8px}.case-nav{gap:4px}article{border-radius:22px}.three{gap:12px}.closing blockquote{font-size:21px}}@media(max-width:410px){h1{font-size:42px!important}.hero-bubble{width:104px;height:125px}.brand-caption{display:none}header .quiet{font-size:11px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.celebration{display:none}}
.name-gate{position:fixed;inset:0;z-index:30;display:grid;place-items:center;background:#201c57b8;backdrop-filter:blur(9px);padding:22px;overflow:auto}.name-card{width:min(100%,480px);padding:40px;background:#fffafa;border-radius:32px;box-shadow:0 20px 80px #130e4c55;border-top:8px solid var(--pink)}.name-card h2{font-size:34px;margin:17px 0}.name-card label{display:block;font-weight:bold;font-size:13px;margin-top:23px}.name-card input{display:block;width:100%;font:inherit;padding:15px;border:2px solid #d7cce8;border-radius:15px;margin-top:8px;color:var(--navy);background:white}.name-card input:focus{outline:3px solid var(--pink);outline-offset:2px}.name-card .primary{width:100%;margin-top:15px}.name-note{font-size:11px;color:var(--muted)}#nameError{font-size:13px;color:#9b344f}.leaderboard{background:white;border:1px solid var(--line);border-radius:27px;padding:32px;margin-top:40px;box-shadow:0 10px 30px #44316b09}.board-top{display:flex;align-items:center;justify-content:space-between;gap:20px}.board-top h2{margin:10px 0 14px;font-size:29px}.leaderboard p{font-size:12px;color:var(--muted)}#submissionStatus{font-size:15px;color:var(--navy);background:#f4eaf4;padding:15px;border-radius:13px}.board-scroll{overflow:auto}table{width:100%;border-collapse:collapse;font-size:14px}th{text-align:left;font-size:10px;letter-spacing:1px;text-transform:uppercase;background:#f1eafa;padding:14px}td{padding:15px 14px;border-bottom:1px solid var(--line)}td:last-child,th:last-child{text-align:right;white-space:nowrap}.your-score{background:#fff0f5;font-weight:bold}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:600px){.name-card{padding:28px}.board-top{align-items:start}.board-top h2{font-size:23px}.leaderboard{padding:23px 18px}}