/* Tailwind CSS v4.2.1 preflight (MIT License, Tailwind Labs) */
@layer base {
/*
  1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
  2. Remove default margins and padding
  3. Reset all borders.
*/

*,
::after,
::before,
::backdrop,
::file-selector-button {
  box-sizing: border-box; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 2 */
  border: 0 solid; /* 3 */
}

/*
  1. Use a consistent sensible line-height in all browsers.
  2. Prevent adjustments of font size after orientation changes in iOS.
  3. Use a more readable tab size.
  4. Use the user's configured `sans` font-family by default.
  5. Use the user's configured `sans` font-feature-settings by default.
  6. Use the user's configured `sans` font-variation-settings by default.
  7. Disable tap highlights on iOS.
*/

html,
:host {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  tab-size: 4; /* 3 */
  font-family: ui-sans-serif,
    system-ui,
    sans-serif,
    'Apple Color Emoji',
    'Segoe UI Emoji',
    'Segoe UI Symbol',
    'Noto Color Emoji'; /* 4 */
  font-feature-settings: normal; /* 5 */
  font-variation-settings: normal; /* 6 */
  -webkit-tap-highlight-color: transparent; /* 7 */
}

/*
  1. Add the correct height in Firefox.
  2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
  3. Reset the default border style to a 1px solid border.
*/

hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}

/*
  Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
}

/*
  Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
  Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  -webkit-text-decoration: inherit;
  text-decoration: inherit;
}

/*
  Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
  1. Use the user's configured `mono` font-family by default.
  2. Use the user's configured `mono` font-feature-settings by default.
  3. Use the user's configured `mono` font-variation-settings by default.
  4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace,
    SFMono-Regular,
    Menlo,
    Monaco,
    Consolas,
    'Liberation Mono',
    'Courier New',
    monospace; /* 1 */
  font-feature-settings: normal; /* 2 */
  font-variation-settings: normal; /* 3 */
  font-size: 1em; /* 4 */
}

/*
  Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
  Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
  1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
  2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
  3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}

/*
  Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
  Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
  Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
  Make lists unstyled by default.
*/

ol,
ul,
menu {
  list-style: none;
}

/*
  1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
  2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
      This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}

/*
  Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/*
  1. Inherit font styles in all browsers.
  2. Remove border radius in all browsers.
  3. Remove background color in all browsers.
  4. Ensure consistent opacity for disabled states in all browsers.
*/

button,
input,
select,
optgroup,
textarea,
::file-selector-button {
  font: inherit; /* 1 */
  font-feature-settings: inherit; /* 1 */
  font-variation-settings: inherit; /* 1 */
  letter-spacing: inherit; /* 1 */
  color: inherit; /* 1 */
  border-radius: 0; /* 2 */
  background-color: transparent; /* 3 */
  opacity: 1; /* 4 */
}

/*
  Restore default font weight.
*/

:where(select:is([multiple], [size])) optgroup {
  font-weight: bolder;
}

/*
  Restore indentation.
*/

:where(select:is([multiple], [size])) optgroup option {
  padding-inline-start: 20px;
}

/*
  Restore space after button.
*/

::file-selector-button {
  margin-inline-end: 4px;
}

/*
  Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
*/

::placeholder {
  opacity: 1;
}

/*
  Set the default placeholder color to a semi-transparent version of the current text color in browsers that do not
  crash when using `color-mix(…)` with `currentcolor`. (https://github.com/tailwindlabs/tailwindcss/issues/17194)
*/

@supports (not (-webkit-appearance: -apple-pay-button)) /* Not Safari */ or
  (contain-intrinsic-size: 1px) /* Safari 17+ */ {
  ::placeholder {
    color: color-mix(in oklab, currentcolor 50%, transparent);
  }
}

/*
  Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
  Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
  1. Ensure date/time inputs have the same height when empty in iOS Safari.
  2. Ensure text alignment can be changed on date/time inputs in iOS Safari.
*/

::-webkit-date-and-time-value {
  min-height: 1lh; /* 1 */
  text-align: inherit; /* 2 */
}

/*
  Prevent height from changing on date/time inputs in macOS Safari when the input is set to `display: block`.
*/

::-webkit-datetime-edit {
  display: inline-flex;
}

/*
  Remove excess padding from pseudo-elements in date/time inputs to ensure consistent height across browsers.
*/

::-webkit-datetime-edit-fields-wrapper {
  padding: 0;
}

::-webkit-datetime-edit,
::-webkit-datetime-edit-year-field,
::-webkit-datetime-edit-month-field,
::-webkit-datetime-edit-day-field,
::-webkit-datetime-edit-hour-field,
::-webkit-datetime-edit-minute-field,
::-webkit-datetime-edit-second-field,
::-webkit-datetime-edit-millisecond-field,
::-webkit-datetime-edit-meridiem-field {
  padding-block: 0;
}

/*
  Center dropdown marker shown on inputs with paired `<datalist>`s in Chrome. (https://github.com/tailwindlabs/tailwindcss/issues/18499)
*/

::-webkit-calendar-picker-indicator {
  line-height: 1;
}

/*
  Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
  Correct the inability to style the border radius in iOS Safari.
*/

button,
input:where([type='button'], [type='reset'], [type='submit']),
::file-selector-button {
  appearance: button;
}

/*
  Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
  Make elements with the HTML hidden attribute stay hidden by default.
*/

[hidden]:where(:not([hidden='until-found'])) {
  display: none !important;
}

}


:root{--ink:#193d35;--green:#23785b;--mint:#e4eee8;--cream:#f7f8f2;--line:#dde4dc;--muted:#708278;--orange:#d78348}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:Inter,'PingFang TC','Microsoft JhengHei',sans-serif;font-size:15px;line-height:1.65}button,input,select,textarea{font:inherit}button{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:9px;transition:background .15s,transform .15s}button:disabled{cursor:not-allowed;opacity:.5}button:not(:disabled):active{transform:translateY(1px)}button:focus-visible,a:focus-visible{outline:3px solid #d8944d;outline-offset:4px}input:focus,select:focus,textarea:focus{outline:2px solid #46966f;outline-offset:2px}a{color:var(--green)}h1,h2,p{margin-top:0}header{height:96px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 6.5%;background:#fafbf6}.brand{border:0;background:none;text-align:left;padding:0;font-size:21px;font-weight:750;letter-spacing:1px}.brand small{display:block;font-size:9px;letter-spacing:1.8px;color:var(--muted);font-weight:600}.brand-icon{background:var(--green);color:white;border-radius:11px;width:44px;height:44px;display:grid;place-items:center}.header-right{display:flex;gap:27px;align-items:center;color:var(--muted);font-size:13px}.version,.pill{border:1px solid var(--line);background:#f1f4ed;border-radius:30px;padding:5px 13px;font-size:12px}.landing{max-width:1180px;padding:66px 35px 0;margin:auto;display:grid;grid-template-columns:1.08fr 1fr;column-gap:86px}.eyebrow,.step-label{font-size:12px;letter-spacing:1.2px;font-weight:650;color:var(--green);display:flex;align-items:center;gap:9px}.eyebrow>span,.tiny-dot{display:inline-block;width:7px;height:7px;background:var(--green);border-radius:50%}.hero h1{font-size:64px;line-height:1.28;letter-spacing:1px;margin:22px 0;position:relative;font-weight:650}.hero h1>span{color:var(--green);position:relative}.hero h1>span:after{content:'';height:6px;position:absolute;bottom:-6px;left:0;right:0;border-radius:70%;background:#c8d5a7}.hero h1 i{font-style:normal;color:#daa15f;font-size:37px;margin-left:22px}.intro{color:var(--muted);line-height:1.95;font-size:16px}.hero-facts{display:flex;gap:25px;font-size:12px;margin:23px 0 30px}.hero-facts span{display:flex;gap:7px;align-items:center}.lesson-art{height:221px;position:relative;overflow:hidden;background:#193e36;border-radius:18px;color:#f5efdc;padding:31px}.moon{position:absolute;top:23px;right:47px;width:110px;height:110px;background:radial-gradient(circle at 32% 28%,#fff8d7,#e4ca87);border-radius:50%;box-shadow:0 0 40px #eedbab18}.orbit{position:absolute;width:290px;height:290px;border:1px solid #cdd9b31b;border-radius:50%;top:-69px;right:-36px}.orbit.two{width:370px;height:370px;top:-108px;right:-77px}.poem{font-family:'Songti TC','Noto Serif TC',serif;font-size:27px;letter-spacing:5px;line-height:1.75;position:relative}.poem span{margin-left:28px}.art-foot{display:flex;align-items:center;gap:12px;font-size:10px;position:absolute;bottom:26px;left:31px;right:15px;color:#abc4b5}.art-foot strong{color:#ebe7d5;font-size:13px}.star{position:absolute;color:#dfc48e}.s1{right:18px;top:43px;font-size:20px}.s2{right:146px;top:17px}.art-stamp{position:absolute;border:1px solid #cb9d72;color:#cb9d72;right:29px;bottom:69px;writing-mode:vertical-rl;font-family:serif;font-size:12px;padding:4px;letter-spacing:4px}.entry{background:white;align-self:start;border:1px solid var(--line);border-radius:20px;box-shadow:0 13px 38px #21443107;margin-top:23px;overflow:hidden}.tabs{display:flex;padding:8px;background:#ecf0e8;margin:10px;border-radius:12px;gap:5px}.tabs>button{width:50%;background:none;border:0;color:var(--muted);padding:11px 3px;border-radius:8px;font-weight:600}.tabs>button.active{background:white;color:var(--ink);box-shadow:0 2px 7px #203c3210}.entry-body{padding:28px 31px 26px}.entry h2{font-size:26px;margin:8px 0}.muted{color:var(--muted);font-size:14px}.small{font-size:12px}label{display:block;font-weight:600;font-size:13px;margin:21px 0 0}input,select,textarea{display:block;width:100%;margin-top:8px;padding:12px 13px;border:1px solid #dbe2d9;border-radius:9px;background:#fdfefa;color:var(--ink);min-width:0}input::placeholder{color:#9aa59b;font-weight:400}.code-input{letter-spacing:2px;font-size:19px}.primary,.secondary,.cream-button{border:0;border-radius:9px;padding:13px 20px;font-weight:600}.primary{background:var(--green);color:white}.primary:hover{background:#1a654b}.wide{width:100%;margin-top:27px;justify-content:space-between}.entry-note{display:flex;align-items:center;justify-content:center;gap:7px;text-align:center;color:var(--muted);font-size:11px;margin-top:20px}.entry-note .tiny-dot{width:5px;height:5px}.bank-card{border:1px solid var(--line);background:#f6f8f2;border-radius:10px;display:flex;padding:15px;justify-content:space-between;gap:10px;margin-top:23px}.bank-card strong{font-size:14px}.bank-card strong span{font-weight:400;color:var(--muted)}.bank-card small{display:block;font-size:10px;color:var(--muted);margin-top:4px}.text-button{background:none;border:none;padding:0;color:var(--green);font-size:12px}.how{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);margin-top:53px;padding:28px 0 36px;gap:30px}.how>div{position:relative;padding-left:45px}.how b{position:absolute;left:0;top:0;color:#98ad83;font-size:19px;font-family:serif}.how strong{font-size:13px}.how p{font-size:11px;color:var(--muted);margin:4px 0}.editor{grid-column:1/-1;padding-top:60px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.section-heading h2{margin:0;font-size:20px}.edit-card{background:white;border:1px solid var(--line);padding:23px;border-radius:15px;margin-bottom:15px}.row{display:flex;justify-content:space-between;align-items:center;gap:15px}.edit-options{display:grid;grid-template-columns:1fr 1fr;gap:20px}.icon-button{background:none;border:0;color:#947360;padding:5px}.secondary{background:#e6eee7;color:var(--ink);font-size:13px}.ghost{background:none;border:0;color:var(--muted);padding:6px}.alert{border:1px solid #dcab87;background:#fff2e9;color:#8a4823;padding:14px 18px;border-radius:9px;grid-column:1/-1;margin:18px 0}.room-main{max-width:1150px;margin:45px auto 80px;padding:0 28px;min-height:65vh}.room-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}.room-heading h1{font-size:31px;margin:12px 0}.status{border-radius:30px;padding:7px 14px;background:#e8eedd;font-size:12px;display:flex;align-items:center;gap:8px;white-space:nowrap}.status>span{width:6px;height:6px;border-radius:50%;background:#75a465}.status.closed{background:#ecece6}.room-banner{display:flex;justify-content:space-between;align-items:center;background:var(--ink);color:white;padding:30px 39px;border-radius:17px;margin:23px 0}.room-banner>div>span{font-size:12px;color:#bdd1c3}.room-code{font-size:51px;font-weight:650;letter-spacing:10px;line-height:1.5}.light-button{background:transparent;color:#d9e7dc;border:0;padding:0;font-size:11px}.room-banner small{display:block;font-size:11px;color:#c0d3c4}.banner-action{display:flex;flex-direction:column;align-items:flex-end;gap:12px}.banner-action strong{font-size:26px}.banner-action strong small{display:inline;font-size:13px;font-weight:400}.cream-button{background:#e9edb9;color:#274535;padding:11px 25px;font-size:13px}.dashboard-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:25px}.panel{background:white;border:1px solid var(--line);border-radius:16px;padding:26px}.panel h2{font-size:20px;margin:0 0 14px}.empty{color:var(--muted);text-align:center;padding:65px 10px;font-size:14px;line-height:2}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:13px;text-align:left;white-space:nowrap}th{font-weight:500;color:var(--muted);padding:14px 8px;background:#f8f9f4}td{padding:16px 8px;border-bottom:1px solid #eef1ea}.rank{color:#8ca58b;width:24px;display:inline-block}.green{color:var(--green)}.question-stat{padding:14px 0;border-bottom:1px solid #eef1ea;font-size:12px}.question-stat summary{cursor:pointer;list-style:none}.question-stat p{margin-top:13px}.progress{height:5px;background:#e9eee6;border-radius:5px;margin-top:12px;overflow:hidden}.progress i{display:block;height:100%;background:#7faa87;border-radius:5px;transition:width .3s}.student-heading{display:flex;justify-content:space-between;align-items:center;max-width:720px;margin:auto}.score{display:flex;align-items:center;gap:7px;background:#e8eecd;border-radius:20px;padding:7px 15px;font-size:21px;font-weight:700}.score small{font-size:12px;font-weight:400}.student-title{text-align:center;font-size:25px;margin:29px 0}.waiting,.quiz,.result{max-width:720px;margin:auto;padding:38px}.waiting{text-align:center;padding:70px 25px}.waiting-moon{display:grid;place-items:center;width:90px;height:90px;background:#f1f0d9;border-radius:50%;margin:0 auto 30px;color:#ac995a}.quiz h2{font-size:24px;margin:30px 0;line-height:1.7}.answer-options{display:flex;flex-direction:column;gap:13px}.option{text-align:left;justify-content:flex-start;background:#fcfdf9;border:1px solid var(--line);border-radius:10px;padding:16px;font-size:15px}.option>span{width:31px;height:31px;flex-shrink:0;display:grid;place-items:center;border-radius:7px;background:#eaf0e6;font-weight:650}.option.selected{background:#edf6ef;border-color:var(--green);box-shadow:0 0 0 1px var(--green)}.option.selected>span{background:var(--green);color:white}.option>svg{margin-left:auto;flex-shrink:0}.feedback{padding:25px;border-radius:12px;background:#eef5e9}.feedback strong{font-size:21px}.feedback p{margin:14px 0 0}.feedback.incorrect{background:#fcf2e5;color:#815832}.result{text-align:center}.result-icon{font-size:55px;color:#b8a05c}.result .step-label{justify-content:center}.result h2{font-size:29px;margin-top:10px}.big-score{font-size:65px;color:var(--green);font-weight:700}.big-score small{font-size:20px;font-weight:400;color:var(--muted)}.review{text-align:left}.review details{border-top:1px solid var(--line);padding:16px 0}.review summary{display:flex;justify-content:space-between;cursor:pointer}.review p{margin-top:14px}.review strong{color:var(--green)}footer{display:flex;justify-content:space-between;gap:20px;padding:25px 6.5%;border-top:1px solid var(--line);color:#8b9a8b;font-size:11px}footer>span:first-child{font-weight:650;color:var(--ink)}.platform{max-width:1140px;margin:40px auto;padding:0 28px}.platform h1{font-size:30px;margin-bottom:8px}.platform-nav{display:flex;gap:10px;flex-wrap:wrap;margin:28px 0}.platform-nav button{padding:9px 18px;border-radius:8px;background:white;border:1px solid var(--line);color:var(--muted)}.platform-nav button.active{background:var(--ink);color:white}.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.activity{display:flex;flex-direction:column;gap:12px}.activity h3{font-size:21px;margin:0}.activity .row{margin-top:auto}.activity p{margin:0}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.notice{padding:15px;background:#edf2df;border-radius:10px;font-size:13px;margin:15px 0}.modal{position:fixed;inset:0;background:#173c3570;display:grid;place-items:center;padding:20px;z-index:10;overflow:auto}.modal>.panel{width:100%;max-width:620px;max-height:85vh;overflow:auto}.credentials{background:#f6f7f2;padding:15px;font-family:monospace;white-space:pre-wrap;overflow-wrap:anywhere}.inline-actions{display:flex;gap:10px;flex-wrap:wrap}.activity-meta{font-size:12px;color:var(--muted)}.label-chip{padding:3px 10px;border-radius:6px;background:#edf1e2;font-size:11px;align-self:flex-start}textarea{min-height:88px;resize:vertical}.auth-note{margin-top:16px;font-size:12px;color:var(--muted)}
@media(min-width:1450px){.landing{padding-top:85px;column-gap:100px}}
@media(max-width:900px){header{padding:0 5%;height:83px}.desktop{display:none}.landing{column-gap:35px;padding:43px 27px 0}.hero h1{font-size:51px}.hero-facts{gap:12px;font-size:10px}.entry-body{padding:24px}.lesson-art{padding:23px;height:203px}.poem{font-size:22px;letter-spacing:2px}.moon{width:87px;height:87px;right:26px}.art-foot{left:23px;gap:7px}.art-foot span:last-child{display:none}.dashboard-grid{grid-template-columns:1fr}.hero h1 i{margin-left:10px}}
@media(max-width:620px){header{height:77px;padding:0 20px}.brand{font-size:18px;gap:8px}.brand-icon{width:38px;height:38px}.brand small{font-size:8px}.version{font-size:10px;padding:4px 9px}.header-right{gap:5px}.landing{grid-template-columns:1fr;padding:32px 22px 0}.hero h1{font-size:45px;line-height:1.24;margin:18px 0}.hero h1 br{display:none}.hero h1 i{font-size:24px}.intro{font-size:14px;margin-bottom:10px}.hero-facts{margin:18px 0;font-size:11px;gap:25px}.lesson-art{height:156px;padding:19px 25px}.poem{font-size:23px;line-height:1.5}.moon{width:88px;height:88px;right:38px;top:16px}.art-foot{left:25px;bottom:16px}.art-stamp{bottom:29px;right:19px}.entry{margin-top:25px;border-radius:15px}.entry-body{padding:23px}.entry h2{font-size:24px}.entry .muted{font-size:12px}.how{gap:8px;margin-top:32px;padding:24px 0;grid-template-columns:repeat(3,1fr)}.how>div{padding-left:0}.how b{position:static;display:block;font-size:17px;margin-bottom:5px}.how strong{font-size:12px}.how p{font-size:10px}.section-heading{align-items:flex-start}.section-heading h2{font-size:18px}.edit-options,.form-grid{grid-template-columns:1fr;gap:0}.editor{padding-top:35px}.room-main{margin:26px auto 45px;padding:0 18px}.room-heading{display:block}.room-heading h1{font-size:24px}.room-heading .status{display:inline-flex}.room-banner{padding:22px;gap:12px}.room-code{font-size:34px;letter-spacing:5px}.banner-action strong{font-size:21px}.banner-action strong small{font-size:10px}.banner-action svg{width:22px}.cream-button{padding:10px;font-size:12px}.panel{padding:21px}.student-title{font-size:22px;margin:24px 0}.quiz h2{font-size:21px;margin:25px 0}.option{font-size:14px;padding:13px}.waiting{padding:50px 20px}.waiting h2{font-size:21px}.score{font-size:19px}.platform{padding:0 18px;margin:25px auto}.platform h1{font-size:25px}.cards{grid-template-columns:1fr}.platform-nav{gap:7px}.platform-nav button{font-size:12px;padding:8px 12px}.table-wrap{margin:0 -7px}footer{font-size:10px;padding:20px;flex-wrap:wrap;gap:7px}footer>span:nth-child(2){width:100%;order:2}.header-right .ghost{font-size:11px}.alert{font-size:13px}.section-heading .text-button{white-space:nowrap}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.brand{display:flex;align-items:center;gap:11px;flex-shrink:0}
.sandbox{position:fixed;inset:0;background:#b4dae4;color:#f7f3df;z-index:20;font-family:'PingFang TC','Microsoft JhengHei',sans-serif;overflow:hidden}.world-canvas{position:absolute;inset:0;touch-action:none}.world-canvas canvas{display:block;width:100%;height:100%;touch-action:none}.world-top{position:absolute;left:20px;right:20px;top:18px;display:flex;align-items:center;justify-content:space-between;gap:10px;pointer-events:none}.world-top>*{pointer-events:auto}.world-button,.world-score,.world-title,.quest-hud,.world-tools,.materials,.world-help,.gestures,.jump-button,.dpad button{background:#223c35ed;border:2px solid #b7c7a54a;border-radius:6px;box-shadow:0 4px 0 #182d2a55;backdrop-filter:blur(6px)}.world-button{color:#f4eed7;padding:10px 14px;font-size:12px}.world-title{padding:9px 23px;text-align:center}.world-title strong{font-size:20px;letter-spacing:4px;display:block}.world-title small{font-size:10px;color:#b6cebd}.world-score{display:flex;align-items:center;gap:8px;padding:12px 16px;color:#f5d67e;font-size:23px;font-weight:700}.world-score small{font-size:10px;font-weight:400}.quest-hud{position:absolute;left:20px;top:104px;padding:17px 19px;width:237px}.quest-hud>span{font-size:10px;color:#bccebc}.quest-hud strong{display:block;font-size:17px;margin-top:6px}.quest-hud small{display:block;font-size:11px;color:#cfdbc5;line-height:1.7;margin-top:10px}.quest-hud .progress{background:#3e5950}.quest-hud .progress i{background:#e4c369}.quest-button{background:#ead18b;color:#334530;border:0;border-radius:4px;padding:8px 12px;width:100%;margin-top:15px;font-weight:650;font-size:12px}.world-help{position:absolute;right:22px;top:104px;max-width:310px;padding:18px;font-size:12px}.world-help>button:first-child{position:absolute;top:4px;right:8px;background:none;border:0;color:#c6dac8;font-size:21px}.world-help strong{color:#f2dda5;font-size:14px}.world-help p{margin:12px 0;line-height:1.9;color:#d3dfce}.world-help small{font-size:10px;color:#a5baa7}.world-bottom{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column-reverse;align-items:center;gap:12px}.world-tools{display:flex;align-items:center;padding:7px;gap:6px}.world-tools>button{color:#bdd0b8;background:none;border:2px solid transparent;border-radius:4px;padding:10px 15px;flex-direction:column;gap:3px}.world-tools>button.selected{color:#f6db8d;background:#607c5f88;border-color:#e5ce83}.world-tools>button span{font-size:10px}.inventory{display:flex;flex-direction:column;align-items:center;padding:0 15px;color:#f6d27e;font-size:24px;font-weight:700}.inventory small{font-size:10px;color:#bccab3;font-weight:400}.materials{display:flex;gap:7px;padding:7px}.materials button{background:transparent;color:#d4e1ce;font-size:10px;border:1px solid transparent;padding:6px 9px;flex-direction:column;gap:3px}.materials button.selected{border-color:#e3cd85;background:#a8b47b22}.materials i{width:24px;height:24px;box-shadow:inset -5px -5px 0 #0002;display:block}.dpad{position:absolute;left:24px;bottom:25px;display:flex;align-items:center;flex-direction:column;gap:5px;touch-action:none}.dpad>div{display:flex;gap:5px}.dpad button{width:48px;height:45px;color:#dce4c7;touch-action:none;user-select:none}.jump-button{position:absolute;right:28px;bottom:35px;width:68px;height:68px;color:#e4e8d1;touch-action:none;user-select:none;font-size:12px}.world-error{position:absolute;bottom:145px;left:50%;transform:translateX(-50%);background:#7a392cee;border:1px solid #d8a181;padding:11px 19px;border-radius:5px;max-width:90%;font-size:12px;text-align:center}.gestures{position:absolute;right:90px;bottom:115px;display:flex;flex-direction:column;padding:8px;gap:5px}.gestures button{background:none;border:0;padding:9px 24px;color:#e9e8cc;font-size:12px}.gestures button:hover{background:#74907444}@media(max-width:700px){.world-top{left:10px;right:10px;top:10px;gap:6px}.world-title{padding:7px 10px}.world-title strong{font-size:16px;letter-spacing:1px}.world-title small{font-size:8px}.world-button{padding:10px;font-size:10px}.world-button span{display:none}.world-score{padding:8px;font-size:18px;gap:4px}.world-score small{display:none}.quest-hud{left:10px;top:85px;padding:12px;width:185px}.quest-hud strong{font-size:14px}.quest-hud small{font-size:10px}.quest-hud .quest-button{margin-top:9px;padding:7px;font-size:11px}.world-help{left:10px;right:10px;top:auto;bottom:220px;max-width:none;padding:16px;font-size:11px}.world-help small{font-size:9px}.world-bottom{bottom:12px}.world-tools{gap:1px;padding:5px}.world-tools>button{padding:7px 12px}.world-tools>button span{font-size:9px}.inventory{font-size:19px;padding:0 8px}.dpad{left:13px;bottom:107px;gap:4px}.dpad button{width:43px;height:40px}.dpad>div{gap:4px}.jump-button{right:17px;bottom:119px;width:56px;height:56px}.world-error{bottom:215px;max-width:90%;width:max-content;font-size:11px}.gestures{right:15px;bottom:185px}.materials button{padding:4px 7px}.materials{gap:6px}.hero h1 br{display:block}}

.account-email,.student-identity{display:block;font-size:11px;color:var(--muted,#758078);margin-top:4px}.header-right{flex-wrap:wrap}.header-right>span{overflow-wrap:anywhere}td .text-button+ .text-button{margin-left:12px}

.literature-entry{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:28px}.literature-entry h2{margin:12px 0}.literature-stats{display:flex;gap:24px;align-items:center;margin:25px 0}.literature-stats strong{font-size:32px;color:#24685d}.literature-stats small{font-size:16px}.match-board{display:grid;grid-template-columns:minmax(0,3fr) 60px minmax(0,1fr);margin:25px 0}.match-column{display:grid;grid-template-rows:repeat(4,108px);gap:12px}.sentence-card,.rhetoric-card{border:2px solid #deded4;border-radius:12px;background:#fafaf4;padding:16px;text-align:left;display:flex;flex-direction:column;justify-content:center;color:#253e38;min-width:0}.sentence-card.selected{border-color:#287765;background:#e5f3ec}.sentence-card.correct{border-color:#66a98b}.sentence-card.incorrect{border-color:#ce9b8e}.sentence-card:disabled{opacity:1}.sentence-card small{margin-top:5px}.rhetoric-card{text-align:center;align-items:center;font-weight:700;background:#edf4ee}.rhetoric-card:disabled{opacity:.65}.match-lines{width:100%;height:480px}.answer-note{border-left:3px solid #aac9b1;padding-left:12px;line-height:1.7}.import-option{display:flex;gap:10px;align-items:center}.import-option input{width:20px}td code{display:block;max-width:200px;overflow-wrap:anywhere}@media(max-width:600px){.literature-entry{align-items:stretch;flex-direction:column}.match-board{grid-template-columns:minmax(0,3fr) 30px minmax(70px,1fr)}.sentence-card,.rhetoric-card{padding:8px;font-size:13px}.literature-stats{flex-direction:column;gap:4px;align-items:flex-start}}

.danger-text{color:#a63e32}.danger-button{background:#a63e32}

.password-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:20px}

/* 字界: carved glyphs, warm paper and jade. */
.avatar-card{display:flex;align-items:center;gap:22px;padding:24px;margin:0 0 24px;border:1px solid #cabd98;border-radius:12px;background:#f5f0df;color:#345c50}.avatar-card>svg{flex-shrink:0;padding:12px;background:#254d41;color:#eed6a0;border-radius:8px;width:90px;height:100px}.avatar-card h2{margin:4px 0 8px}.avatar-card p{font-size:13px;margin:0 0 6px}.avatar-card small{font-size:11px;color:#6f796b}.avatar-card>a{margin-left:auto;white-space:nowrap;color:#356353;font-size:12px}.glyph-constellation{display:flex;gap:18px;position:absolute;left:24px;top:18px;color:#e9d3a0}.glyph-constellation svg:nth-child(even){transform:translateY(15px)}.materials svg{color:#f3dca5}.world-title strong{font-family:serif;font-size:25px;letter-spacing:8px}.brand>span:last-child{letter-spacing:2px}.brand small{letter-spacing:1px}@media(max-width:600px){.avatar-card{gap:14px;padding:16px;flex-wrap:wrap}.avatar-card>div{flex:1;min-width:170px}.avatar-card>a{margin-left:104px}.glyph-constellation{gap:10px;left:18px}.glyph-constellation svg{width:45px;height:45px}}
