*{box-sizing:border-box}html{min-height:100%;background:#f4f5fa}body{margin:0;color:#30354d;background:#f4f5fa;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",Arial,sans-serif;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}main{max-width:624px;margin:0 auto;padding:28px 22px}a{color:#6b5bd5;text-decoration:none}.student-header{padding:3px 0 29px;min-height:70px}.student-header:after,.class-context:after,.compose-label:after,.feed-heading:after{content:'';display:table;clear:both}.student-brand{display:inline-block;color:#38374d;vertical-align:middle}.brand-mark{display:inline-block;width:34px;height:34px;margin-right:8px;background:#6b5bdc;border-radius:10px;line-height:34px;text-align:center;color:#fff;font-size:25px;vertical-align:middle;box-shadow:0 4px 12px rgba(104,87,207,.18)}.student-brand b{font-size:18px;vertical-align:middle}.student-brand small{display:inline-block;margin-left:10px;padding-left:10px;border-left:1px solid #d8d8e5;color:#9b9bac;font-size:11px;vertical-align:middle}.switch-class{float:right;font-size:12px;line-height:34px;color:#8b86a5}.switch-class span{margin-left:4px}.student-card{padding:32px;background:#fff;border:1px solid #e5e4ef;border-radius:20px;box-shadow:0 10px 35px rgba(56,46,100,.035)}.card-intro{margin-bottom:24px}.eyebrow{display:block;color:#9b8dcc;font-size:11px;letter-spacing:2px;font-weight:600}h1{font-size:26px;line-height:1.45;margin:10px 0;color:#302b49;letter-spacing:-.6px;word-wrap:break-word}.card-intro p{font-size:13px;color:#9c98ad;line-height:1.8;margin:0}form{margin:0}label{display:block;margin:22px 0 10px;font-size:13px;font-weight:600;color:#646079}input,textarea,button{font:inherit;border-radius:11px;-webkit-appearance:none}input,textarea{display:block;width:100%;padding:14px 16px;border:1px solid #e0ddec;background:#faf9fd;color:#46405e;line-height:1.6}input:focus,textarea:focus{outline:2px solid #d8cff9;border-color:#a89adc;background:#fff}input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{color:#b4adc8}input::placeholder,textarea::placeholder{color:#b4adc8}textarea{resize:vertical;font-size:15px;min-height:135px}button,.primary-link{display:block;width:100%;padding:13px 18px;border:0;margin:22px 0 0;background:#6b5bdc;color:#fff;font-size:14px;font-weight:600;cursor:pointer;text-align:left;box-shadow:0 5px 13px rgba(107,91,220,.16);line-height:1.6}button span,.primary-link span{float:right;font-size:18px;line-height:22px}button:hover,.primary-link:hover{background:#5c4bc9}button:focus{outline:2px solid #d8cff9;outline-offset:3px}button:disabled{background:#ccc6df;color:#fff;cursor:default;box-shadow:none}.primary-link{border-radius:11px}.class-context{padding:11px 14px;background:#f7f6fc;border:1px solid #eeebf7;border-radius:9px;margin:0 0 22px;font-size:11px;line-height:1.8}.class-context>span{color:#aaa1bf;letter-spacing:1px}.class-context b{float:right;color:#8b7bb7;font-size:11px;font-weight:500;max-width:72%;text-align:right;word-wrap:break-word}.class-context b:before{content:'•';margin-right:5px;color:#9c8ec6}.field-note{margin:9px 0 0;color:#aaa4b8;font-size:11px}.notice{color:#6c59a9;font-size:12px;white-space:pre-wrap;line-height:1.8;margin:16px 0 0}.notice:empty{display:none}.compose-label{margin-top:0}.compose-label small{float:right;font-size:11px;font-weight:400;color:#b4adc3}.starters{margin-top:3px}.starters button{display:inline-block;max-width:100%;word-wrap:break-word;width:auto;padding:6px 11px;margin:10px 6px 0 0;background:#f4f1fc;color:#9b8bbf;border:1px solid #eae3f7;font-size:11px;font-weight:400;box-shadow:none;text-align:left;border-radius:7px}.starters button:hover{background:#eae4f9;color:#7965a4}.join-card{position:relative;padding:35px 36px 25px;overflow:hidden}.join-card .card-intro{margin-top:20px}.join-art{height:94px;position:relative;width:210px;margin:7px auto 28px}.bubble{position:absolute;display:block;border-radius:15px;font-weight:600;line-height:1;text-align:center;box-shadow:0 6px 15px rgba(104,87,207,.04)}.bubble:after{content:'';position:absolute;bottom:-6px;left:17px;width:12px;height:12px;transform:skewY(-35deg);background:inherit;border-radius:0 0 3px 0}.bubble-one{left:14px;top:9px;width:79px;height:56px;padding-top:16px;font-size:24px;background:#eee9fc;color:#b0a0da;transform:rotate(-9deg)}.bubble-two{left:99px;top:0;width:51px;height:45px;padding-top:8px;background:#6b5bdc;color:#e7dfff;font-size:27px;transform:rotate(9deg)}.bubble-three{left:112px;top:61px;width:67px;height:33px;padding-top:1px;font-size:25px;background:#f0edf7;color:#c6b9df;transform:rotate(-4deg)}.join-card h1{font-size:28px}.code-input{font-size:25px;letter-spacing:8px;text-align:center;font-weight:500;padding:13px 12px 13px 20px;background:#fbfafe}.code-input::-webkit-input-placeholder{font-size:16px;font-weight:400;letter-spacing:5px}.code-input::placeholder{font-size:16px;font-weight:400;letter-spacing:5px}.join-hint{text-align:center;font-size:10px;color:#b6afc5;margin:18px 0 0}.my-messages{margin-top:29px}.feed-heading{margin:0 3px 14px}.feed-heading h2{float:left;margin:0;font-size:15px;font-weight:600;color:#767087}.feed-heading>span{float:right;font-size:10px;color:#b2adbd;line-height:24px}.feed-item{position:relative;background:#fff;border:1px solid #e7e4ef;padding:18px 20px;border-radius:13px;margin:10px 0;word-wrap:break-word}.feed-status{display:inline-block;background:#f6f1fc;color:#b198c2;border-radius:5px;padding:2px 7px;font-size:10px;line-height:1.7}.feed-status--approved{background:#edf7f1;color:#80a990}.feed-item p{margin:9px 0 0;white-space:pre-wrap;font-size:14px;color:#746c86;line-height:1.8}.feed-empty{text-align:center;padding:18px 15px 23px;border:1px dashed #e0dbe9;border-radius:13px;background:#faf9fc}.feed-empty>span{display:block;color:#c8bbdc;font-size:28px;line-height:1.2}.feed-empty p{color:#a79db7;font-size:12px;margin:5px 0}.feed-empty small{font-size:10px;color:#bfb7ca}footer{color:#ada6bd;font-size:11px;text-align:center;padding:30px 10px 7px;letter-spacing:.5px}footer span{display:block;font-size:9px;margin-top:8px;color:#c0bacb}
@media(min-width:760px){main{padding-top:45px}.join-card{padding:40px 46px 29px}.join-art{margin-top:16px;margin-bottom:35px}.join-card .card-intro{margin-bottom:30px}.join-card h1{font-size:30px}}@media(max-width:420px){main{padding:20px 16px}.student-header{padding-bottom:22px}.student-brand small{font-size:10px;margin-left:8px;padding-left:8px}.switch-class{font-size:11px}.student-card{padding:26px 23px;border-radius:17px}.join-card{padding:29px 25px 23px}.join-card h1{font-size:25px}.card-intro p{font-size:12px}h1{font-size:23px}.join-art{margin-top:0;margin-bottom:27px}.join-hint{font-size:9px}.class-context{padding:10px 11px}.starters button{padding:6px 9px}.feed-item{padding:16px 18px}footer{font-size:10px}}

/* Clear text and touch targets on classroom tablets. */
.card-intro p{color:#837c94;font-size:14px}.eyebrow{color:#8d7cb6;font-size:12px}.switch-class{color:#81758f;font-size:12px}.student-brand small{color:#82788e}.join-hint{font-size:12px;color:#968aa5;line-height:1.8}.class-context,.class-context b{font-size:12px}.class-context>span{color:#8c7da2}.class-context b{color:#7e6b9f}.field-note{color:#93869f;font-size:12px}.compose-label small{color:#9c8daa;font-size:12px}.starters button{font-size:13px;color:#8772a6;padding:7px 11px}.feed-heading>span{font-size:12px;color:#a295ad}.feed-status{font-size:11px;color:#9775aa}.feed-status--approved{color:#548564}.feed-empty p{font-size:13px;color:#8f7f9f}.feed-empty small{font-size:12px;color:#a193ae}button,.primary-link{font-size:16px;min-height:50px}.starters button{min-height:36px}.code-input::-webkit-input-placeholder{color:#a498b7}.code-input::placeholder{color:#a498b7}footer{font-size:12px;color:#a296ae}footer span{font-size:10px;color:#b0a4ba}@media(max-width:420px){.card-intro p{font-size:13px}.join-hint{font-size:11px}.student-brand small{font-size:10px}.class-context,.class-context b{font-size:11px}}
