@khanacademy/perseus-editor 41.0.0 → 42.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -4,12 +4,6 @@ import type { A11yIssue, Issue } from "./components/issues-panel";
4
4
  import type { A11yReport } from "./preview/use-preview-controller";
5
5
  import type { APIOptions, DeviceType, ImageUploader, PerseusDependenciesV2 } from "@khanacademy/perseus";
6
6
  import type { Hint, PerseusAnswerArea, PerseusItem, PerseusRenderer } from "@khanacademy/perseus-core";
7
- type OnChangeParams = {
8
- jsonMode?: boolean;
9
- question?: PerseusRenderer;
10
- hints?: Hint[];
11
- answerArea?: PerseusAnswerArea | null | undefined;
12
- };
13
7
  type Props = {
14
8
  /** Additional templates that the host application would like to display
15
9
  * within the Perseus Editor.
@@ -18,8 +12,8 @@ type Props = {
18
12
  apiOptions?: APIOptions;
19
13
  answerArea: PerseusAnswerArea;
20
14
  dependencies: PerseusDependenciesV2;
21
- /** "Power user" mode. Shows the raw JSON of the question. */
22
- developerMode: boolean;
15
+ /** @deprecated - has no effect */
16
+ developerMode?: boolean;
23
17
  hints: Hint[];
24
18
  /** A function which takes a file object (guaranteed to be an image) and
25
19
  * a callback, then calls the callback with the url where the image
@@ -29,15 +23,12 @@ type Props = {
29
23
  imageUploader?: ImageUploader;
30
24
  /** The content ID of the AssessmentItem being edited. */
31
25
  itemId: string;
32
- /** Whether the question is displaying as JSON or if it is
33
- * showing the editor itself with the rendering
34
- * Only used in the perseus demos. Consider removing.
35
- */
26
+ /** Shows a textarea with the raw JSON instead of the editor GUI. */
36
27
  jsonMode: boolean;
37
28
  /** A function which is called with the new JSON blob of content. */
38
- onChange: (changed: OnChangeParams) => void;
39
- /** A function which is called when the preview device changes. */
40
- onPreviewDeviceChange: (arg1: DeviceType) => unknown;
29
+ onChange: (changed: PerseusItem) => void;
30
+ /** @deprecated - has no effect, and is never called */
31
+ onPreviewDeviceChange?: (arg1: DeviceType) => unknown;
41
32
  previewDevice: DeviceType;
42
33
  /** A global control to expand/collapse all widget editors on a page. */
43
34
  widgetsAreOpen?: boolean;
@@ -56,7 +47,6 @@ type Props = {
56
47
  };
57
48
  type DefaultProps = {
58
49
  answerArea: Props["answerArea"];
59
- developerMode: Props["developerMode"];
60
50
  hints: Props["hints"];
61
51
  jsonMode: Props["jsonMode"];
62
52
  onChange: Props["onChange"];
@@ -90,7 +80,6 @@ declare class EditorPage extends React.Component<Props, State> {
90
80
  * we need to update state.json to reflect those changes.
91
81
  */
92
82
  syncJsonStateFromProps(): void;
93
- toggleJsonMode: () => void;
94
83
  getSaveWarnings(): any;
95
84
  /**
96
85
  * Returns the current version of the edited {@link PerseusItem}.
@@ -98,7 +87,7 @@ declare class EditorPage extends React.Component<Props, State> {
98
87
  * @deprecated Use the {@link Props.onChange} prop instead.
99
88
  */
100
89
  serialize(): PerseusItem;
101
- handleChange: (toChange: OnChangeParams) => void;
90
+ handleChange: (toChange: Partial<PerseusItem>) => void;
102
91
  handleEditorChange: (newProps: Partial<PerseusRenderer>) => void;
103
92
  changeJSON: (newJson: PerseusItem) => void;
104
93
  render(): React.ReactNode;
package/dist/es/index.css CHANGED
@@ -1,4 +1,4 @@
1
- .widget-editor-settings-container{padding-block-start:var(--wb-sizing-size_120)!important;padding-inline:var(--wb-sizing-size_120)!important}.best-practices-container{margin-block-end:var(--wb-sizing-size_060)!important}code{font-family:Courier,monospace}.pod-title{background-color:#eee;border:1px solid #ddd;border-bottom:0;border-radius:3px 3px 0 0;font-size:1.25em;padding:4px 10px}.perseus-editor-left-cell>.perseus-hint-editor>.pod-title,.perseus-editor-left-cell>.pod-title{inset-block-start:0;position:sticky;z-index:1}.pod-title.closed{border-radius:3px}.smiley{left:0;position:absolute;top:4px}.perseus-single-editor{box-sizing:border-box;width:100%}.perseus-json-editor{font-family:monospace;height:500px;width:100%}.perseus-json-editor.invalid{background-color:#ffe6e6}.perseus-textarea-pair{border:1px solid #ddd;font-size:12px;line-height:1.6;position:relative}.perseus-textarea-pair>.perseus-textarea-underlay{word-wrap:break-word;color:transparent;margin-bottom:12px;padding:10px;white-space:pre-wrap}.perseus-textarea-pair>.perseus-textarea-underlay b{background-color:#dfd;font-weight:400}.perseus-textarea-pair>.perseus-textarea-underlay b.selected{background-color:#ddf}.perseus-textarea-pair>.perseus-textarea-underlay b.error{background-color:#fcc}.perseus-textarea-pair>textarea{background:transparent;border:0;box-sizing:border-box;font:inherit;height:100%;left:0;overflow:hidden;padding:10px;position:absolute;resize:none;top:0;width:100%}.perseus-widget-row{margin:7px 0;width:100%}.perseus-widget-row .perseus-widget-left-col,.perseus-widget-row .perseus-widget-right-col{display:inline-block;width:50%}.perseus-widget-row .perseus-widget-left-col .range-input,.perseus-widget-row .perseus-widget-right-col .range-input{float:right;margin-right:5px}.perseus-widget-row>.range-input{margin-left:10px}.perseus-answer-options{border:1px solid #ddd;padding:10px}.perseus-answer-options *{margin-bottom:4px}.perseus-answer-widget{border:1px solid #ddd;border-radius:0 0 3px 3px;padding:10px}.perseus-answer-none{border-bottom:1px solid #ddd}.perseus-answer-none>div{display:none}.perseus-widget-editor{border:1px solid #ddd;border-radius:3px}.perseus-widget-editor:not(:first-child){margin-top:10px}.perseus-widget-editor .perseus-widget-editor-title{align-items:center;background-color:#eee;border:0;border-radius:3px 3px 0 0;cursor:pointer;display:flex;font-size:1.25em;padding:4px 10px;position:relative}.perseus-widget-editor .perseus-widget-editor-title.closed{border-radius:3px}.perseus-widget-editor .perseus-widget-editor-title :first-child{flex-grow:1}.perseus-widget-editor .perseus-widget-editor-title>a{color:inherit;text-decoration:none}.perseus-widget-editor .perseus-widget-editor-title .alignment{margin-right:5px}.perseus-widget-editor .perseus-widget-editor-title .simple-button{font-size:13px;padding:0 10px}.perseus-widget-editor .perseus-widget-editor-content{border-radius:0 0 3px 3px;padding:0 var(--wb-sizing-size_100) var(--wb-sizing-size_100);transition:all 0s}.perseus-widget-editor .perseus-widget-editor-content.leave{display:none}.perseus-widget-editor .perseus-widget-editor-content .inline-options{float:inline-start;line-height:24px;padding-inline-end:.5em}.perseus-widget-editor .perseus-widget-editor-content .tooltip-for-legend{display:inline-block;line-height:24px}.perseus-widget-editor .categorizer-container{overflow-x:scroll}.perseus-widget-editor .section-accordion{display:flex;flex-direction:row}.perseus-widget-editor .delete-item-button{align-self:center;padding-right:.5em}.perseus-widget-editor-title-id{align-items:center;display:inline-flex}.perseus-widget-editor-title-id>svg{float:left;font-size:14px;margin-right:10px}.perseus-editor-accordion-container{display:inline-grid;width:100%}.perseus-editor-accordion-container.collapsed{grid-template-rows:0fr;min-height:0;transition:all .25s step-end,grid-template-rows .25s;visibility:hidden}.perseus-editor-accordion-container.expanded{grid-template-rows:1fr;min-height:100%;transition:grid-template-rows .5s;visibility:visible}.perseus-editor-accordion-container .perseus-editor-accordion-content{margin:0 -1px;overflow:hidden;padding:0 1px}.perseus-editor-widgets-selectors{background-color:#eee;border:1px solid #ddd;border-radius:0 0 3px 3px;border-top:0;display:flex;flex-wrap:wrap;padding:10px/2}.perseus-editor-widgets-selectors select{margin:2px}.perseus-editor-widgets>div.selected>strong{background-color:#ddf}.perseus-editor-widgets .warning{background-color:#fcc;margin:4px;padding:4px}.perseus-editor-word-count{cursor:help;flex:1;float:right;margin-right:3px;margin-top:2px;text-align:right}.MathJax .math{color:inherit}#perseus{margin:20px;z-index:10}#perseus #problemarea #workarea{margin:0}#perseus #problemarea #workarea .perseus-image-caption{top:0!important}#perseus .perseus-answer-container>div,#perseus .perseus-question-container>div{padding-bottom:25px}#perseus .add-choice-container{display:flex;flex-direction:row;margin-bottom:20px;text-align:left}#problemarea{float:left;font-size:14px;padding-bottom:38px;position:relative}#problemarea a:link,#problemarea input,#problemarea label,#problemarea select{position:relative;z-index:3}.perseus-editor-row{display:flex;flex-direction:row;margin-block-end:32px}.perseus-editor-left-cell{margin-inline-end:32px;max-width:360px;min-width:360px;overflow-x:hidden;position:relative;width:360px;z-index:10}.perseus-editor-left-cell,.perseus-editor-right-cell{border:1px solid var(--wb-semanticColor-core-border-neutral-default);display:flex;flex-direction:column;max-height:calc(95vh - 244px);overflow-y:auto;vertical-align:top}.perseus-editor-right-cell{box-sizing:border-box;flex-shrink:0;padding:5px 30px 30px}.perseus-hint-editor .perseus-single-editor{margin-bottom:5px}.perseus-hint-editor .remove-hint{float:right;font-size:13px;padding:0 10px}.perseus-hint-editor+div .perseus-hint-renderer{width:100%}.perseus-hint-editor+div .perseus-hint-renderer div.paragraph{margin:0 0 22px}.perseus-hint-editor-actions{margin:8px;margin-block-start:0}.perseus-article-editor{margin-bottom:20px;margin-top:20px}.perseus-article-editor .section-control-button,.perseus-article-editor .step-control-button{font-size:13px;margin:0 2px;padding:2px 10px}.perseus-article-editor .perseus-editor-left-cell{min-width:360px}.perseus-article-editor .perseus-editor-left-cell>.perseus-editor-sticky-header{background-color:var(--wb-semanticColor-core-background-base-default);flex-shrink:0;inset-block-start:0;position:sticky;z-index:1}.perseus-article-editor .perseus-editor-sticky-header .perseus-widget-editor-panel{max-height:40vh;overflow-y:auto}.perseus-article-editor .desktop-preview,.perseus-article-editor .editor-preview,.perseus-article-editor .mobile-preview,.perseus-article-editor .standalone-preview{box-sizing:border-box}.perseus-article-editor .mobile-preview{border:1px solid rgba(0,0,0,.29);box-shadow:0 2px 4px 0 rgba(0,0,0,.29);max-width:322px;padding:32px 16px}.perseus-article-editor .desktop-preview{border:1px solid transparent;padding:32px 20px}.perseus-article-editor .editor-preview{border:1px solid var(--wb-semanticColor-core-border-neutral-default);flex-shrink:0;max-height:calc(95vh - 244px);overflow-y:auto}.perseus-article-editor .editor-preview.full-width{width:100%}.perseus-article-editor .editor-preview .desktop-preview{border:1px solid rgba(0,0,0,.29);box-shadow:0 2px 4px 0 rgba(0,0,0,.29);width:100%}.perseus-article-editor .standalone-preview .desktop-preview,.perseus-article-editor .standalone-preview .mobile-preview{margin-left:auto;margin-right:auto}.perseus-article-editor .json-editor{margin:auto;max-width:688px}.perseus-article-editor .perseus-json-editor{display:block;margin-left:auto;margin-right:auto}.perseus-article-editor .json-editor-warning{margin-bottom:10px;text-align:center}.perseus-article-editor .framework-perseus.perseus-article{box-sizing:border-box}.perseus-article-editor .framework-perseus.perseus-article *{box-sizing:inherit}.perseus-article-editor .perseus-editor-sticky-header>.pod-title{align-items:center;display:flex;justify-content:space-between;padding:4px 9px}.perseus-widget-dropdown input[type=text]{border:1px solid #ccc;border-radius:5px;padding:5px}.perseus-widget-dropdown .dropdown-choices{margin:20px 0}.perseus-widget-dropdown .dropdown-choices .dropdown-choice{align-items:center;display:flex;flex-direction:row;gap:10px;margin-bottom:10px}.perseus-widget-dropdown .dropdown-info{display:inline-flex;margin-bottom:16px}.perseus-widget-dropdown .dropdown-field{align-items:center;display:flex;flex-direction:row;margin-bottom:16px;min-width:0}.perseus-widget-dropdown .remove-choice{margin-bottom:10px}.perseus-input-number-editor{font-family:Lato,Noto Sans,sans-serif;font-size:16px;font-weight:400;line-height:20px}.perseus-input-number-editor .answer-option .unsimplified-options{min-height:48px}.perseus-input-number-editor .perseus-textarea-pair{font-size:16px}.perseus-input-number-editor .perseus-textarea-pair .perseus-textarea-underlay{margin-bottom:26px}.perseus-input-number-editor .perseus-textarea-pair textarea{background-color:#fff;border:1px solid rgba(33,36,44,.5);border-radius:4px}.perseus-input-number-editor .input-answer-editor-message,.perseus-input-number-editor .input-answer-editor-value{display:inline-block}.perseus-input-number-editor .input-answer-editor-value-container{display:block}.perseus-input-number-editor .input-answer-editor-value-container input{background:#fff;border:1px solid rgba(33,36,44,.5);border-radius:4px;color:#21242c;font-family:Lato,Noto Sans,sans-serif;font-size:16px;font-weight:400;line-height:20px;outline-offset:-2px}.perseus-input-number-editor .input-answer-editor-value-container .numeric-input-value{margin-left:8px;width:6em}.perseus-input-number-editor .input-answer-editor-value-container .max-error-input-value{display:none;width:3em}.perseus-input-number-editor .input-answer-editor-value-container .max-error-plusmn{cursor:default;display:none;height:32px;padding-top:4px;text-align:center;vertical-align:top;width:1em}.perseus-input-number-editor .input-answer-editor-value-container.with-max-error .numeric-input-value,.perseus-input-number-editor .input-answer-editor-value-container:focus-within .numeric-input-value{border-bottom-right-radius:0;border-right:none;border-top-right-radius:0}.perseus-input-number-editor .input-answer-editor-value-container.with-max-error .max-error-input-value,.perseus-input-number-editor .input-answer-editor-value-container:focus-within .max-error-input-value{border-bottom-left-radius:0;border-left:none;border-top-left-radius:0;display:inline-block}.perseus-input-number-editor .input-answer-editor-value-container.with-max-error .max-error-plusmn,.perseus-input-number-editor .input-answer-editor-value-container:focus-within .max-error-plusmn{border-bottom:1px solid rgba(33,36,44,.5);border-top:1px solid rgba(33,36,44,.5);display:inline-block}.perseus-input-number-editor .answer-status,.perseus-input-number-editor .answer-trash,.perseus-input-number-editor .options-toggle{height:26px;line-height:26px;outline-offset:-3px;vertical-align:middle}.perseus-input-number-editor .value-divider{border-top:1px solid #ccc}.perseus-input-number-editor .answer-trash,.perseus-input-number-editor .options-toggle{border-left:1px solid #ccc;box-sizing:border-box;cursor:pointer;display:inline-block;text-align:center;text-decoration:none;width:20%}.perseus-input-number-editor .options-toggle{background-color:#eee;color:#444}.perseus-input-number-editor .options-toggle:hover{background-color:#ccc}.perseus-input-number-editor .answer-trash{background-color:#c04f03;background-image:linear-gradient(180deg,#e35d04,#c04f03);color:#fff}.perseus-input-number-editor .answer-trash:hover{background-image:linear-gradient(180deg,#f46e15,#d16014);color:#fff}.perseus-input-number-editor .is-strict-indicator{background-color:#d9edf7;border-bottom:1px solid #ccc;font-size:16px;height:12px;line-height:12px;top:0}.perseus-input-number-editor .is-strict-indicator,.perseus-input-number-editor .simplify-indicator{border-right:1px solid #ccc;bottom:auto;cursor:default;left:0;position:absolute;right:auto;text-align:center;-webkit-user-select:none;user-select:none;width:12px}.perseus-input-number-editor .simplify-indicator{border-top:1px solid #ccc;font-size:10px;height:13px;line-height:13px;top:12px}.perseus-input-number-editor .simplify-indicator.optional{background-color:#afa}.perseus-input-number-editor .simplify-indicator.enforced{background-color:#fcc}.perseus-input-number-editor .answer-status{color:inherit;display:inline-block;text-align:center;text-decoration:none;-webkit-user-select:none;user-select:none;width:60%}.perseus-input-number-editor .answer-status.wrong{background-color:#fcc}.perseus-input-number-editor .answer-status.correct{background-color:#afa}.perseus-input-number-editor .answer-status.ungraded{background-color:#d9edf7}.perseus-input-number-editor .input-answer-editor-message{margin-left:5px}.perseus-input-number-editor .input-answer-editor-message .perseus-single-editor{font-family:Lucida Grande;width:230px}.perseus-input-number-editor .input-answer-editor-message .perseus-single-editor .perseus-textarea-pair>textarea,.perseus-input-number-editor .input-answer-editor-message .perseus-single-editor .perseus-textarea-underlay{padding:5px}.perseus-input-number-editor .input-answer-editor-message .perseus-single-editor .perseus-textarea-pair{border-color:#ccc;border-radius:3px;min-height:53px}.perseus-input-number-editor .input-answer-editor-message .perseus-single-editor .perseus-textarea-underlay{margin-bottom:0}.perseus-widget-radio{margin-bottom:10px}.perseus-widget-radio .choice-editor .perseus-single-editor{margin-bottom:0}.perseus-widget-radio .choice-editor.correct textarea{background:#afa}.perseus-widget-radio .choice-editor.incorrect textarea{background:#fcc}.perseus-widget-radio textarea::placeholder{color:#777}.perseus-widget-radio .rationale-editor .perseus-textarea-pair{border-top:0}.perseus-widget-radio .choice-editor,.perseus-widget-radio .choice-rationale-editors,.perseus-widget-radio .rationale-editor{display:inline-block;width:100%}.perseus-widget-radio .perseus-single-editor{border:0;display:inline-block;margin:0 0 5px;vertical-align:top}.perseus-widget-radio .perseus-single-editor p{margin:0}.perseus-widget-radio .perseus-textarea-pair,.perseus-widget-radio .perseus-textarea-underlay{display:block;overflow-wrap:anywhere}.perseus-widget-radio .perseus-textarea-pair>.perseus-textarea-underlay,.perseus-widget-radio .perseus-textarea-pair>textarea{padding:5px}.perseus-widget-editor-content .add-choice-container .simple-button{margin-right:10px}.perseus-widget-editor-content .perseus-widget-radio{position:static}.perseus-widget-editor-content .perseus-widget-radio .checkbox{position:relative;top:-10px}.perseus-widget-editor-content .perseus-radio-option.none-of-above:before{content:"None of the above";display:block;font-style:italic;font-weight:700}.perseus-widget-editor-content .perseus-radio-option.none-of-above .choice-editor.incorrect{opacity:.5}#solutionarea .perseus-widget-radio li{padding:7px 0}.framework-perseus table.perseus-widget-table-of-values th .perseus-single-editor{margin-bottom:6px;width:80px}.framework-perseus table.perseus-widget-table-of-values th .perseus-single-editor,.framework-perseus table.perseus-widget-table-of-values th .perseus-textarea-pair{height:50px}.categorization-container.categorization-container-editor{margin-bottom:160px;width:350px}.categorization-container.categorization-container-editor .card input{display:block;font-size:12px;margin:7px 3px 7px 13px;width:81%}.categorization-container.categorization-container-editor .category{float:left;padding:5px;width:160px}.categorization-container.categorization-container-editor .categories{width:176px}.categorization-container.categorization-container-editor .perseus-textarea-underlay{margin-bottom:0}.categorization-container.categorization-container-editor .drag-bar{float:left;font-size:10px;height:70%;margin-top:3px;padding:2px 0}.categorization-container.categorization-container-editor .header{margin-bottom:8px}.categorization-container.categorization-container-editor .header input{display:block;margin-right:24px;width:76%}.categorization-container.categorization-container-editor .header .remove{color:#666;cursor:pointer;float:right;height:20px;left:12px;padding:2px;position:relative;top:-14px;width:20px}.categorization-container.categorization-container-editor .header .remove:hover{color:#333}.categorization-container.categorization-container-editor .delete-item-area{border:2px dashed #888;bottom:-150px;color:#888;font-size:20px;height:60px;left:10px;padding-top:40px;position:absolute;text-align:center;width:150px}.categorization-container.categorization-container-editor .delete-item-area.target{border-color:#000;color:#333}.categorization-container.categorization-container-editor .card{padding:0;width:130px}.categorization-container.categorization-container-editor .card.dragging .drag-bar{margin-left:2px}.categorization-editor-area{height:30px}.categorization-editor-area .add-item{float:left;margin-left:17px}.categorization-editor-area .add-category{margin-left:173px}.perseus-widget-interactive-graph{display:block}.perseus-widget-plotter-editor .pic-url,.perseus-widget-plotter-editor .plotter-categories{width:70%}.perseus-text-list-editor input[type=text]{margin-right:5px;max-width:340px;min-width:20px;padding:3px}.perseus-text-list-editor.layout-horizontal input[type=text]{float:left}.perseus-matcher-editor .perseus-text-list-editor{float:left;max-width:50%}.perseus-matcher-editor .perseus-text-list-editor input[type=text]{max-width:90%}.perseus-matcher-editor input[type=text]{width:46%}.perseus-matcher-editor input[type=text]+input[type=text]{margin-left:2%}.info-tip{display:inline-block}.info-tip-content-container p{font-size:12px;line-height:1.4;margin:0}.info-tip-content-container p+p{margin-top:22px}.perseus-widget-interaction-editor .perseus-widget-interaction-editor-select-element{background-color:#eee;border:1px solid #ddd;border-radius:0 0 3px 3px;border-top:0;margin:20px -11px -11px;padding:5px 10px}.perseus-widget-interaction-editor .colorpicker-circle{border-radius:50%;height:14px;left:5px;position:absolute;top:5px;width:14px}.perseus-interaction-element{border:1px solid #ddd;border-radius:3px}.perseus-interaction-element .perseus-interaction-element-title{background-color:#eee;border:0;border-radius:3px 3px 0 0;color:inherit;display:block;font-size:1.25em;font-size:1em;overflow:hidden;padding:4px 10px;text-decoration:none;white-space:nowrap}.perseus-interaction-element .perseus-interaction-element-title.closed{border-radius:3px}.perseus-interaction-element .perseus-interaction-element-title>svg{float:left;font-size:14px;margin-right:10px}.perseus-interaction-element .perseus-interaction-element-content{border-radius:0 0 3px 3px;border-top:1px solid #ddd;padding:10px}.perseus-interaction-element .perseus-interaction-element-content .edit-controls{margin-top:-30px;text-align:right}.perseus-interaction-element .perseus-interaction-element-content .edit-controls>button{background:#fff;border:0;color:#555;cursor:pointer;font-size:18px;margin-left:7px;padding:0}.perseus-interaction-element .perseus-interaction-element-content.leave{display:none}.button-set-separator{margin:10px 0}.perseus-widget-editor .unit-radio{color:#000;text-decoration:none}.unit-example-not-okay{color:red}.unit-example-okay{color:green}.pair-editor input{width:120px}.marvel-device.iphone6.silver:after{z-index:1}.perseus-diff{margin:0 10px}.perseus-diff .diff-header{display:inline-block;font-size:18px;padding:10px 0;width:50%}.perseus-diff .diff-header.collapsed{font-size:14px;padding:0}.perseus-diff .diff-body{border-bottom:1px solid #e4e4e4;border-top:1px solid #e4e4e4}.perseus-diff .diff-row{box-sizing:border-box;font-size:14px;overflow:hidden;padding-left:10px;padding-right:20px;white-space:pre-wrap;width:50%}.perseus-diff .diff-row.collapsed{color:#888;cursor:pointer}.perseus-diff .diff-row.collapsed:hover{color:#666}.perseus-diff .diff-row.collapsed:active{color:#444}.perseus-diff .diff-row .diff-line{margin-bottom:20px}.perseus-diff .before{border-left:1px solid #e4e4e4;float:left}.perseus-diff .after{border-left:1px solid #e4e4e4;border-right:1px solid #e4e4e4;float:right}.perseus-diff .inner-value{height:100%;padding:3px}.perseus-diff .not-present{display:none}.perseus-diff .blank-space{visibility:hidden}.perseus-diff .added{background-color:#efe}.perseus-diff .added.dark{background-color:#afa}.perseus-diff .removed{background-color:#fee}.perseus-diff .removed.dark{background-color:#faa}.perseus-diff .image{display:inline-block;margin-bottom:10px;margin-left:20px}.perseus-diff .image,.perseus-diff .image>div,.perseus-diff .image>img{max-height:300px;max-width:100%}.perseus-diff .image-unchanged{border:1px solid #aaa}.perseus-diff .image-added{border:2px solid #afa}.perseus-diff .image-removed{border:2px solid #faa}.perseus-diff .diff-separator{border-bottom:1px dashed #444;margin:30px 0 10px}.perseus-editor-table fieldset{min-inline-size:0;min-width:0}.perseus-single-editor.perseus-editor-disabled .keypad-input,.perseus-single-editor.perseus-editor-disabled .perseus-math-input,.perseus-single-editor.perseus-editor-disabled .perseus-textarea-pair,.perseus-single-editor.perseus-editor-disabled input,.perseus-single-editor.perseus-editor-disabled select{background-color:var(
1
+ .widget-editor-settings-container{padding-block-start:var(--wb-sizing-size_120)!important;padding-inline:var(--wb-sizing-size_120)!important}.best-practices-container{margin-block-end:var(--wb-sizing-size_060)!important}code{font-family:Courier,monospace}.pod-title{background-color:#eee;border:1px solid #ddd;border-bottom:0;border-radius:3px 3px 0 0;font-size:1.25em;padding:4px 10px}.perseus-editor-left-cell>.perseus-hint-editor>.pod-title,.perseus-editor-left-cell>.pod-title{inset-block-start:0;position:sticky;z-index:1}.pod-title.closed{border-radius:3px}.smiley{left:0;position:absolute;top:4px}.perseus-single-editor{box-sizing:border-box;width:100%}.perseus-json-editor{font-family:monospace;height:500px;width:100%}.perseus-json-editor.invalid{background-color:#ffe6e6}.perseus-textarea-pair{border:1px solid #ddd;font-size:12px;line-height:1.6;position:relative}.perseus-textarea-pair>.perseus-textarea-underlay{word-wrap:break-word;color:transparent;margin-bottom:12px;padding:10px;white-space:pre-wrap}.perseus-textarea-pair>.perseus-textarea-underlay b{background-color:#dfd;font-weight:400}.perseus-textarea-pair>.perseus-textarea-underlay b.selected{background-color:#ddf}.perseus-textarea-pair>.perseus-textarea-underlay b.error{background-color:#fcc}.perseus-textarea-pair>textarea{background:transparent;border:0;box-sizing:border-box;font:inherit;height:100%;left:0;overflow:hidden;padding:10px;position:absolute;resize:none;top:0;width:100%}.perseus-widget-row{margin:7px 0;width:100%}.perseus-widget-row .perseus-widget-left-col,.perseus-widget-row .perseus-widget-right-col{display:inline-block;width:50%}.perseus-widget-row .perseus-widget-left-col .range-input,.perseus-widget-row .perseus-widget-right-col .range-input{float:right;margin-right:5px}.perseus-widget-row>.range-input{margin-left:10px}.perseus-answer-options{border:1px solid #ddd;padding:10px}.perseus-answer-options *{margin-bottom:4px}.perseus-answer-widget{border:1px solid #ddd;border-radius:0 0 3px 3px;padding:10px}.perseus-answer-none{border-bottom:1px solid #ddd}.perseus-answer-none>div{display:none}.perseus-widget-editor{border:1px solid #ddd;border-radius:3px}.perseus-widget-editor:not(:first-child){margin-top:10px}.perseus-widget-editor .perseus-widget-editor-title{align-items:center;background-color:#eee;border:0;border-radius:3px 3px 0 0;cursor:pointer;display:flex;font-size:1.25em;padding:4px 10px;position:relative}.perseus-widget-editor .perseus-widget-editor-title.closed{border-radius:3px}.perseus-widget-editor .perseus-widget-editor-title :first-child{flex-grow:1}.perseus-widget-editor .perseus-widget-editor-title>a{color:inherit;text-decoration:none}.perseus-widget-editor .perseus-widget-editor-title .alignment{margin-right:5px}.perseus-widget-editor .perseus-widget-editor-title .simple-button{font-size:13px;padding:0 10px}.perseus-widget-editor .perseus-widget-editor-content{border-radius:0 0 3px 3px;padding:0 var(--wb-sizing-size_100) var(--wb-sizing-size_100);transition:all 0s}.perseus-widget-editor .perseus-widget-editor-content.leave{display:none}.perseus-widget-editor .perseus-widget-editor-content .inline-options{float:inline-start;line-height:24px;padding-inline-end:.5em}.perseus-widget-editor .perseus-widget-editor-content .tooltip-for-legend{display:inline-block;line-height:24px}.perseus-widget-editor .categorizer-container{overflow-x:scroll}.perseus-widget-editor .section-accordion{display:flex;flex-direction:row}.perseus-widget-editor .delete-item-button{align-self:center;padding-right:.5em}.perseus-widget-editor-title-id{align-items:center;display:inline-flex}.perseus-widget-editor-title-id>svg{float:left;font-size:14px;margin-right:10px}.perseus-editor-accordion-container{display:inline-grid;width:100%}.perseus-editor-accordion-container.collapsed{grid-template-rows:0fr;min-height:0;transition:all .25s step-end,grid-template-rows .25s;visibility:hidden}.perseus-editor-accordion-container.expanded{grid-template-rows:1fr;min-height:100%;transition:grid-template-rows .5s;visibility:visible}.perseus-editor-accordion-container .perseus-editor-accordion-content{margin:0 -1px;overflow:hidden;padding:0 1px}.perseus-editor-widgets-selectors{background-color:#eee;border:1px solid #ddd;border-radius:0 0 3px 3px;border-top:0;display:flex;flex-wrap:wrap;padding:10px/2}.perseus-editor-widgets-selectors select{margin:2px}.perseus-editor-widgets>div.selected>strong{background-color:#ddf}.perseus-editor-widgets .warning{background-color:#fcc;margin:4px;padding:4px}.perseus-editor-word-count{cursor:help;flex:1;float:right;margin-right:3px;margin-top:2px;text-align:right}.MathJax .math{color:inherit}#perseus{margin:20px;z-index:10}#perseus #problemarea #workarea{margin:0}#perseus #problemarea #workarea .perseus-image-caption{top:0!important}#perseus .add-choice-container{display:flex;flex-direction:row;margin-bottom:20px;text-align:left}#problemarea{float:left;font-size:14px;padding-bottom:38px;position:relative}#problemarea a:link,#problemarea input,#problemarea label,#problemarea select{position:relative;z-index:3}.perseus-editor-row{display:flex;flex-direction:row;margin-block-end:32px}.perseus-editor-left-cell{margin-inline-end:32px;max-width:360px;min-width:360px;overflow-x:hidden;position:relative;width:360px;z-index:10}.perseus-editor-left-cell,.perseus-editor-right-cell{border:1px solid var(--wb-semanticColor-core-border-neutral-default);display:flex;flex-direction:column;max-height:calc(95vh - 244px);overflow-y:auto;vertical-align:top}.perseus-editor-right-cell{box-sizing:border-box;flex-shrink:0;padding:5px 30px 30px}.perseus-hint-editor .perseus-single-editor{margin-bottom:5px}.perseus-hint-editor .remove-hint{float:right;font-size:13px;padding:0 10px}.perseus-hint-editor+div .perseus-hint-renderer{width:100%}.perseus-hint-editor+div .perseus-hint-renderer div.paragraph{margin:0 0 22px}.perseus-hint-editor-actions{margin:8px;margin-block-start:0}.perseus-article-editor{margin-bottom:20px;margin-top:20px}.perseus-article-editor .section-control-button,.perseus-article-editor .step-control-button{font-size:13px;margin:0 2px;padding:2px 10px}.perseus-article-editor .perseus-editor-left-cell{min-width:360px}.perseus-article-editor .perseus-editor-left-cell>.perseus-editor-sticky-header{background-color:var(--wb-semanticColor-core-background-base-default);flex-shrink:0;inset-block-start:0;position:sticky;z-index:1}.perseus-article-editor .perseus-editor-sticky-header .perseus-widget-editor-panel{max-height:40vh;overflow-y:auto}.perseus-article-editor .desktop-preview,.perseus-article-editor .editor-preview,.perseus-article-editor .mobile-preview,.perseus-article-editor .standalone-preview{box-sizing:border-box}.perseus-article-editor .mobile-preview{border:1px solid rgba(0,0,0,.29);box-shadow:0 2px 4px 0 rgba(0,0,0,.29);max-width:322px;padding:32px 16px}.perseus-article-editor .desktop-preview{border:1px solid transparent;padding:32px 20px}.perseus-article-editor .editor-preview{border:1px solid var(--wb-semanticColor-core-border-neutral-default);flex-shrink:0;max-height:calc(95vh - 244px);overflow-y:auto}.perseus-article-editor .editor-preview.full-width{width:100%}.perseus-article-editor .editor-preview .desktop-preview{border:1px solid rgba(0,0,0,.29);box-shadow:0 2px 4px 0 rgba(0,0,0,.29);width:100%}.perseus-article-editor .standalone-preview .desktop-preview,.perseus-article-editor .standalone-preview .mobile-preview{margin-left:auto;margin-right:auto}.perseus-article-editor .json-editor{margin:auto;max-width:688px}.perseus-article-editor .perseus-json-editor{display:block;margin-left:auto;margin-right:auto}.perseus-article-editor .json-editor-warning{margin-bottom:10px;text-align:center}.perseus-article-editor .framework-perseus.perseus-article{box-sizing:border-box}.perseus-article-editor .framework-perseus.perseus-article *{box-sizing:inherit}.perseus-article-editor .perseus-editor-sticky-header>.pod-title{align-items:center;display:flex;justify-content:space-between;padding:4px 9px}.perseus-widget-dropdown input[type=text]{border:1px solid #ccc;border-radius:5px;padding:5px}.perseus-widget-dropdown .dropdown-choices{margin:20px 0}.perseus-widget-dropdown .dropdown-choices .dropdown-choice{align-items:center;display:flex;flex-direction:row;gap:10px;margin-bottom:10px}.perseus-widget-dropdown .dropdown-info{display:inline-flex;margin-bottom:16px}.perseus-widget-dropdown .dropdown-field{align-items:center;display:flex;flex-direction:row;margin-bottom:16px;min-width:0}.perseus-widget-dropdown .remove-choice{margin-bottom:10px}.perseus-input-number-editor{font-family:Lato,Noto Sans,sans-serif;font-size:16px;font-weight:400;line-height:20px}.perseus-input-number-editor .answer-option .unsimplified-options{min-height:48px}.perseus-input-number-editor .perseus-textarea-pair{font-size:16px}.perseus-input-number-editor .perseus-textarea-pair .perseus-textarea-underlay{margin-bottom:26px}.perseus-input-number-editor .perseus-textarea-pair textarea{background-color:#fff;border:1px solid rgba(33,36,44,.5);border-radius:4px}.perseus-input-number-editor .input-answer-editor-message,.perseus-input-number-editor .input-answer-editor-value{display:inline-block}.perseus-input-number-editor .input-answer-editor-value-container{display:block}.perseus-input-number-editor .input-answer-editor-value-container input{background:#fff;border:1px solid rgba(33,36,44,.5);border-radius:4px;color:#21242c;font-family:Lato,Noto Sans,sans-serif;font-size:16px;font-weight:400;line-height:20px;outline-offset:-2px}.perseus-input-number-editor .input-answer-editor-value-container .numeric-input-value{margin-left:8px;width:6em}.perseus-input-number-editor .input-answer-editor-value-container .max-error-input-value{display:none;width:3em}.perseus-input-number-editor .input-answer-editor-value-container .max-error-plusmn{cursor:default;display:none;height:32px;padding-top:4px;text-align:center;vertical-align:top;width:1em}.perseus-input-number-editor .input-answer-editor-value-container.with-max-error .numeric-input-value,.perseus-input-number-editor .input-answer-editor-value-container:focus-within .numeric-input-value{border-bottom-right-radius:0;border-right:none;border-top-right-radius:0}.perseus-input-number-editor .input-answer-editor-value-container.with-max-error .max-error-input-value,.perseus-input-number-editor .input-answer-editor-value-container:focus-within .max-error-input-value{border-bottom-left-radius:0;border-left:none;border-top-left-radius:0;display:inline-block}.perseus-input-number-editor .input-answer-editor-value-container.with-max-error .max-error-plusmn,.perseus-input-number-editor .input-answer-editor-value-container:focus-within .max-error-plusmn{border-bottom:1px solid rgba(33,36,44,.5);border-top:1px solid rgba(33,36,44,.5);display:inline-block}.perseus-input-number-editor .answer-status,.perseus-input-number-editor .answer-trash,.perseus-input-number-editor .options-toggle{height:26px;line-height:26px;outline-offset:-3px;vertical-align:middle}.perseus-input-number-editor .value-divider{border-top:1px solid #ccc}.perseus-input-number-editor .answer-trash,.perseus-input-number-editor .options-toggle{border-left:1px solid #ccc;box-sizing:border-box;cursor:pointer;display:inline-block;text-align:center;text-decoration:none;width:20%}.perseus-input-number-editor .options-toggle{background-color:#eee;color:#444}.perseus-input-number-editor .options-toggle:hover{background-color:#ccc}.perseus-input-number-editor .answer-trash{background-color:#c04f03;background-image:linear-gradient(180deg,#e35d04,#c04f03);color:#fff}.perseus-input-number-editor .answer-trash:hover{background-image:linear-gradient(180deg,#f46e15,#d16014);color:#fff}.perseus-input-number-editor .is-strict-indicator{background-color:#d9edf7;border-bottom:1px solid #ccc;font-size:16px;height:12px;line-height:12px;top:0}.perseus-input-number-editor .is-strict-indicator,.perseus-input-number-editor .simplify-indicator{border-right:1px solid #ccc;bottom:auto;cursor:default;left:0;position:absolute;right:auto;text-align:center;-webkit-user-select:none;user-select:none;width:12px}.perseus-input-number-editor .simplify-indicator{border-top:1px solid #ccc;font-size:10px;height:13px;line-height:13px;top:12px}.perseus-input-number-editor .simplify-indicator.optional{background-color:#afa}.perseus-input-number-editor .simplify-indicator.enforced{background-color:#fcc}.perseus-input-number-editor .answer-status{color:inherit;display:inline-block;text-align:center;text-decoration:none;-webkit-user-select:none;user-select:none;width:60%}.perseus-input-number-editor .answer-status.wrong{background-color:#fcc}.perseus-input-number-editor .answer-status.correct{background-color:#afa}.perseus-input-number-editor .answer-status.ungraded{background-color:#d9edf7}.perseus-input-number-editor .input-answer-editor-message{margin-left:5px}.perseus-input-number-editor .input-answer-editor-message .perseus-single-editor{font-family:Lucida Grande;width:230px}.perseus-input-number-editor .input-answer-editor-message .perseus-single-editor .perseus-textarea-pair>textarea,.perseus-input-number-editor .input-answer-editor-message .perseus-single-editor .perseus-textarea-underlay{padding:5px}.perseus-input-number-editor .input-answer-editor-message .perseus-single-editor .perseus-textarea-pair{border-color:#ccc;border-radius:3px;min-height:53px}.perseus-input-number-editor .input-answer-editor-message .perseus-single-editor .perseus-textarea-underlay{margin-bottom:0}.perseus-widget-radio{margin-bottom:10px}.perseus-widget-radio .choice-editor .perseus-single-editor{margin-bottom:0}.perseus-widget-radio .choice-editor.correct textarea{background:#afa}.perseus-widget-radio .choice-editor.incorrect textarea{background:#fcc}.perseus-widget-radio textarea::placeholder{color:#777}.perseus-widget-radio .rationale-editor .perseus-textarea-pair{border-top:0}.perseus-widget-radio .choice-editor,.perseus-widget-radio .choice-rationale-editors,.perseus-widget-radio .rationale-editor{display:inline-block;width:100%}.perseus-widget-radio .perseus-single-editor{border:0;display:inline-block;margin:0 0 5px;vertical-align:top}.perseus-widget-radio .perseus-single-editor p{margin:0}.perseus-widget-radio .perseus-textarea-pair,.perseus-widget-radio .perseus-textarea-underlay{display:block;overflow-wrap:anywhere}.perseus-widget-radio .perseus-textarea-pair>.perseus-textarea-underlay,.perseus-widget-radio .perseus-textarea-pair>textarea{padding:5px}.perseus-widget-editor-content .add-choice-container .simple-button{margin-right:10px}.perseus-widget-editor-content .perseus-widget-radio{position:static}.perseus-widget-editor-content .perseus-widget-radio .checkbox{position:relative;top:-10px}.perseus-widget-editor-content .perseus-radio-option.none-of-above:before{content:"None of the above";display:block;font-style:italic;font-weight:700}.perseus-widget-editor-content .perseus-radio-option.none-of-above .choice-editor.incorrect{opacity:.5}#solutionarea .perseus-widget-radio li{padding:7px 0}.framework-perseus table.perseus-widget-table-of-values th .perseus-single-editor{margin-bottom:6px;width:80px}.framework-perseus table.perseus-widget-table-of-values th .perseus-single-editor,.framework-perseus table.perseus-widget-table-of-values th .perseus-textarea-pair{height:50px}.categorization-container.categorization-container-editor{margin-bottom:160px;width:350px}.categorization-container.categorization-container-editor .card input{display:block;font-size:12px;margin:7px 3px 7px 13px;width:81%}.categorization-container.categorization-container-editor .category{float:left;padding:5px;width:160px}.categorization-container.categorization-container-editor .categories{width:176px}.categorization-container.categorization-container-editor .perseus-textarea-underlay{margin-bottom:0}.categorization-container.categorization-container-editor .drag-bar{float:left;font-size:10px;height:70%;margin-top:3px;padding:2px 0}.categorization-container.categorization-container-editor .header{margin-bottom:8px}.categorization-container.categorization-container-editor .header input{display:block;margin-right:24px;width:76%}.categorization-container.categorization-container-editor .header .remove{color:#666;cursor:pointer;float:right;height:20px;left:12px;padding:2px;position:relative;top:-14px;width:20px}.categorization-container.categorization-container-editor .header .remove:hover{color:#333}.categorization-container.categorization-container-editor .delete-item-area{border:2px dashed #888;bottom:-150px;color:#888;font-size:20px;height:60px;left:10px;padding-top:40px;position:absolute;text-align:center;width:150px}.categorization-container.categorization-container-editor .delete-item-area.target{border-color:#000;color:#333}.categorization-container.categorization-container-editor .card{padding:0;width:130px}.categorization-container.categorization-container-editor .card.dragging .drag-bar{margin-left:2px}.categorization-editor-area{height:30px}.categorization-editor-area .add-item{float:left;margin-left:17px}.categorization-editor-area .add-category{margin-left:173px}.perseus-widget-interactive-graph{display:block}.perseus-widget-plotter-editor .pic-url,.perseus-widget-plotter-editor .plotter-categories{width:70%}.perseus-text-list-editor input[type=text]{margin-right:5px;max-width:340px;min-width:20px;padding:3px}.perseus-text-list-editor.layout-horizontal input[type=text]{float:left}.perseus-matcher-editor .perseus-text-list-editor{float:left;max-width:50%}.perseus-matcher-editor .perseus-text-list-editor input[type=text]{max-width:90%}.perseus-matcher-editor input[type=text]{width:46%}.perseus-matcher-editor input[type=text]+input[type=text]{margin-left:2%}.info-tip{display:inline-block}.info-tip-content-container p{font-size:12px;line-height:1.4;margin:0}.info-tip-content-container p+p{margin-top:22px}.perseus-widget-interaction-editor .perseus-widget-interaction-editor-select-element{background-color:#eee;border:1px solid #ddd;border-radius:0 0 3px 3px;border-top:0;margin:20px -11px -11px;padding:5px 10px}.perseus-widget-interaction-editor .colorpicker-circle{border-radius:50%;height:14px;left:5px;position:absolute;top:5px;width:14px}.perseus-interaction-element{border:1px solid #ddd;border-radius:3px}.perseus-interaction-element .perseus-interaction-element-title{background-color:#eee;border:0;border-radius:3px 3px 0 0;color:inherit;display:block;font-size:1.25em;font-size:1em;overflow:hidden;padding:4px 10px;text-decoration:none;white-space:nowrap}.perseus-interaction-element .perseus-interaction-element-title.closed{border-radius:3px}.perseus-interaction-element .perseus-interaction-element-title>svg{float:left;font-size:14px;margin-right:10px}.perseus-interaction-element .perseus-interaction-element-content{border-radius:0 0 3px 3px;border-top:1px solid #ddd;padding:10px}.perseus-interaction-element .perseus-interaction-element-content .edit-controls{margin-top:-30px;text-align:right}.perseus-interaction-element .perseus-interaction-element-content .edit-controls>button{background:#fff;border:0;color:#555;cursor:pointer;font-size:18px;margin-left:7px;padding:0}.perseus-interaction-element .perseus-interaction-element-content.leave{display:none}.button-set-separator{margin:10px 0}.perseus-widget-editor .unit-radio{color:#000;text-decoration:none}.unit-example-not-okay{color:red}.unit-example-okay{color:green}.pair-editor input{width:120px}.marvel-device.iphone6.silver:after{z-index:1}.perseus-diff{margin:0 10px}.perseus-diff .diff-header{display:inline-block;font-size:18px;padding:10px 0;width:50%}.perseus-diff .diff-header.collapsed{font-size:14px;padding:0}.perseus-diff .diff-body{border-bottom:1px solid #e4e4e4;border-top:1px solid #e4e4e4}.perseus-diff .diff-row{box-sizing:border-box;font-size:14px;overflow:hidden;padding-left:10px;padding-right:20px;white-space:pre-wrap;width:50%}.perseus-diff .diff-row.collapsed{color:#888;cursor:pointer}.perseus-diff .diff-row.collapsed:hover{color:#666}.perseus-diff .diff-row.collapsed:active{color:#444}.perseus-diff .diff-row .diff-line{margin-bottom:20px}.perseus-diff .before{border-left:1px solid #e4e4e4;float:left}.perseus-diff .after{border-left:1px solid #e4e4e4;border-right:1px solid #e4e4e4;float:right}.perseus-diff .inner-value{height:100%;padding:3px}.perseus-diff .not-present{display:none}.perseus-diff .blank-space{visibility:hidden}.perseus-diff .added{background-color:#efe}.perseus-diff .added.dark{background-color:#afa}.perseus-diff .removed{background-color:#fee}.perseus-diff .removed.dark{background-color:#faa}.perseus-diff .image{display:inline-block;margin-bottom:10px;margin-left:20px}.perseus-diff .image,.perseus-diff .image>div,.perseus-diff .image>img{max-height:300px;max-width:100%}.perseus-diff .image-unchanged{border:1px solid #aaa}.perseus-diff .image-added{border:2px solid #afa}.perseus-diff .image-removed{border:2px solid #faa}.perseus-diff .diff-separator{border-bottom:1px dashed #444;margin:30px 0 10px}.perseus-editor-table fieldset{min-inline-size:0;min-width:0}.perseus-single-editor.perseus-editor-disabled .keypad-input,.perseus-single-editor.perseus-editor-disabled .perseus-math-input,.perseus-single-editor.perseus-editor-disabled .perseus-textarea-pair,.perseus-single-editor.perseus-editor-disabled input,.perseus-single-editor.perseus-editor-disabled select{background-color:var(
2
2
  --wb-semanticColor-input-disabled-background
3
3
  )!important;border-color:var(--wb-semanticColor-input-disabled-border)!important;cursor:not-allowed!important}.perseus-editor-disabled .perseus-widget-plotter{pointer-events:none}.perseus_o-vx07Zg{padding-left:var(--wb-sizing-size_080);padding-right:var(--wb-sizing-size_080)}.perseus_873n-udD{padding-bottom:var(--wb-sizing-size_060);padding-top:var(--wb-sizing-size_060)}.perseus_x7ZKrcCV{border:1px solid #ddd;border-radius:3px;display:flex;flex-direction:column}.perseus_oxdBYi-q{display:flex;gap:var(--wb-sizing-size_120)}.perseus_086GhAqW{text-transform:uppercase!important}.perseus_Xz7kTZ-l{font-style:italic!important}.perseus_xzQO7ISR{gap:var(--wb-sizing-size_120)!important}.perseus_AIxq-uWT{gap:var(--wb-sizing-size_080)!important}.perseus_ppk4h52d{padding-inline:var(--wb-sizing-size_160)!important}.perseus_n2P9eL87{font-size:18px;font-weight:700}.perseus_09NCEMrz{font-size:18px}.perseus_fGIysYAE{font-size:110%;font-weight:700;margin-top:var(--wb-sizing-size_100)}.perseus_4qo24hC2{align-items:start;background-color:var(
4
4
  --wb-semanticColor-core-background-instructive-subtle
@@ -1 +1 @@
1
- {"version":3,"sources":["widget-editor-settings.css","perseus-editor.css","expression-editor.module.css","graded-group-editor.module.css","image-editor.module.css","dark-mode-toggle.module.css","decorative-toggle.module.css","segmented-control.module.css","numeric-input-editor.module.css","interactive-graph-editor.module.css","interactive-graph-description.module.css","interactive-graph-settings.module.css","interactive-graph-sr-tree.module.css","show-point-labels-toggle.module.css","locked-figure-select.module.css","coordinate-pair-input.module.css","color-select.module.css","line-weight-select.module.css","locked-ellipse-settings.module.css","locked-figure-aria.module.css","locked-figure-settings-actions.module.css","locked-label-settings.module.css","locked-function-settings.module.css","locked-line-settings.module.css","locked-point-settings.module.css","locked-polygon-settings.module.css","locked-vector-settings.module.css","locked-figures-section.module.css","start-coords-shared.module.css","answer-choices.module.css","label-image-editor.module.css","select-image.module.css","radio-editor.module.css","card-editor.module.css","sorter-editor.module.css"],"names":[],"mappings":"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","file":"index.css","sourcesContent":["/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.widget-editor-settings-container {\n padding-inline: var(--wb-sizing-size_120) !important;\n padding-block-start: var(--wb-sizing-size_120) !important;\n}\n\n.best-practices-container {\n margin-block-end: var(--wb-sizing-size_060) !important;\n}\n","code {\n font-family: Courier, monospace;\n}\n.pod-title {\n background-color: #eee;\n border: 1px solid #ddd;\n border-bottom: 0;\n font-size: 1.25em;\n padding: 4px 10px;\n border-radius: 3px 3px 0 0;\n}\n/* Pin the \"Question\", \"Question extras\", and \"Hint\" titles to the top of their\n * left cell, which is the scroll container. */\n.perseus-editor-left-cell > .pod-title,\n.perseus-editor-left-cell > .perseus-hint-editor > .pod-title {\n position: sticky;\n inset-block-start: 0;\n /* Draw above the editor content that scrolls underneath. */\n z-index: 1;\n}\n.pod-title.closed {\n border-radius: 3px;\n}\n.smiley {\n position: absolute;\n left: 0px;\n top: 4px;\n}\n.perseus-single-editor {\n box-sizing: border-box;\n width: 100%;\n}\n.perseus-json-editor {\n width: 100%;\n font-family: monospace;\n height: 500px;\n}\n.perseus-json-editor.invalid {\n background-color: #ffe6e6;\n}\n.perseus-textarea-pair {\n border: 1px solid #ddd;\n font-size: 12px;\n line-height: 1.6;\n position: relative;\n}\n.perseus-textarea-pair > .perseus-textarea-underlay {\n color: transparent;\n margin-bottom: 12px;\n padding: 10px;\n white-space: pre-wrap;\n word-wrap: break-word;\n}\n.perseus-textarea-pair > .perseus-textarea-underlay b {\n font-weight: normal;\n background-color: #dfd;\n}\n.perseus-textarea-pair > .perseus-textarea-underlay b.selected {\n background-color: #ddf;\n}\n.perseus-textarea-pair > .perseus-textarea-underlay b.error {\n background-color: #fcc;\n}\n.perseus-textarea-pair > textarea {\n background: transparent;\n border: 0;\n box-sizing: border-box;\n font: inherit;\n height: 100%;\n left: 0;\n overflow: hidden;\n padding: 10px;\n position: absolute;\n resize: none;\n top: 0;\n width: 100%;\n}\n.perseus-widget-row {\n margin: 7px 0;\n width: 100%;\n}\n.perseus-widget-row .perseus-widget-left-col,\n.perseus-widget-row .perseus-widget-right-col {\n display: inline-block;\n width: 50%;\n}\n.perseus-widget-row .perseus-widget-left-col .range-input,\n.perseus-widget-row .perseus-widget-right-col .range-input {\n float: right;\n margin-right: 5px;\n}\n.perseus-widget-row > .range-input {\n margin-left: 10px;\n}\n.perseus-answer-options {\n border: 1px solid #ddd;\n padding: 10px;\n}\n.perseus-answer-options * {\n margin-bottom: 4px;\n}\n.perseus-answer-widget {\n border: 1px solid #ddd;\n border-radius: 0 0 3px 3px;\n padding: 10px;\n}\n.perseus-answer-none {\n border-bottom: 1px solid #ddd;\n}\n.perseus-answer-none > div {\n display: none;\n}\n.perseus-widget-editor {\n border: 1px solid #ddd;\n border-radius: 3px;\n}\n.perseus-widget-editor:not(:first-child) {\n margin-top: 10px;\n}\n.perseus-widget-editor .perseus-widget-editor-title {\n background-color: #eee;\n font-size: 1.25em;\n padding: 4px 10px;\n border-radius: 3px 3px 0 0;\n border: 0;\n display: flex;\n align-items: center;\n position: relative;\n cursor: pointer;\n}\n.perseus-widget-editor .perseus-widget-editor-title.closed {\n border-radius: 3px;\n}\n.perseus-widget-editor .perseus-widget-editor-title :first-child {\n flex-grow: 1;\n}\n.perseus-widget-editor .perseus-widget-editor-title > a {\n color: inherit;\n text-decoration: none;\n}\n.perseus-widget-editor .perseus-widget-editor-title .alignment {\n margin-right: 5px;\n}\n.perseus-widget-editor .perseus-widget-editor-title .simple-button {\n font-size: 13px;\n padding: 0 10px;\n}\n.perseus-widget-editor .perseus-widget-editor-content {\n border-radius: 0 0 3px 3px;\n padding: 0 var(--wb-sizing-size_100) var(--wb-sizing-size_100);\n transition: all 0s;\n}\n.perseus-widget-editor .perseus-widget-editor-content.leave {\n display: none;\n}\n.perseus-widget-editor .perseus-widget-editor-content .inline-options {\n float: inline-start;\n /* flexbox and inline-block don't work on <legend> elements, so going old-school here */\n line-height: 24px;\n /* for alignment with items in same line (like pills or buttons) */\n padding-inline-end: 0.5em;\n}\n.perseus-widget-editor .perseus-widget-editor-content .tooltip-for-legend {\n display: inline-block;\n line-height: 24px;\n}\n.perseus-widget-editor .categorizer-container {\n overflow-x: scroll;\n}\n.perseus-widget-editor .section-accordion {\n display: flex;\n flex-direction: row;\n}\n.perseus-widget-editor .delete-item-button {\n align-self: center;\n padding-right: 0.5em;\n}\n.perseus-widget-editor-title-id {\n display: inline-flex;\n align-items: center;\n}\n.perseus-widget-editor-title-id > svg {\n float: left;\n font-size: 14px;\n margin-right: 10px;\n}\n.perseus-editor-accordion-container {\n display: inline-grid;\n width: 100%;\n}\n.perseus-editor-accordion-container.collapsed {\n grid-template-rows: 0fr;\n min-height: 0;\n visibility: hidden;\n transition:\n all 0.25s step-end,\n grid-template-rows 0.25s;\n}\n.perseus-editor-accordion-container.expanded {\n grid-template-rows: 1fr;\n min-height: 100%;\n visibility: visible;\n transition: grid-template-rows 0.5s;\n}\n.perseus-editor-accordion-container .perseus-editor-accordion-content {\n overflow: hidden;\n margin: 0 -1px;\n /* allows focus ring on accordion to show */\n padding: 0 1px;\n}\n.perseus-editor-widgets-selectors {\n background-color: #eee;\n border: 1px solid #ddd;\n border-top: 0;\n border-radius: 0 0 3px 3px;\n display: flex;\n flex-wrap: wrap;\n padding: 10px / 2;\n}\n.perseus-editor-widgets-selectors select {\n margin: 2px;\n}\n.perseus-editor-widgets > div.selected > strong {\n background-color: #ddf;\n}\n.perseus-editor-widgets .warning {\n background-color: #ffcccc;\n padding: 4px;\n margin: 4px;\n}\n.perseus-editor-word-count {\n cursor: help;\n flex: 1;\n float: right;\n margin-right: 3px;\n margin-top: 2px;\n text-align: right;\n}\n.MathJax .math {\n color: inherit;\n}\n#perseus {\n margin: 20px;\n z-index: 10;\n}\n#perseus #problemarea #workarea {\n margin: 0;\n}\n#perseus #problemarea #workarea .perseus-image-caption {\n top: 0px !important;\n}\n#perseus .perseus-question-container > div,\n#perseus .perseus-answer-container > div {\n padding-bottom: 25px;\n}\n#perseus .add-choice-container {\n display: flex;\n flex-direction: row;\n margin-bottom: 20px;\n text-align: left;\n}\n#problemarea {\n font-size: 14px;\n position: relative;\n float: left;\n padding-bottom: 38px;\n}\n#problemarea a:link,\n#problemarea input,\n#problemarea label,\n#problemarea select {\n /* for dropdowns */\n position: relative;\n z-index: 3;\n /* interactive-content */\n}\n.perseus-editor-row {\n display: flex;\n flex-direction: row;\n margin-block-end: 32px;\n}\n.perseus-editor-left-cell {\n display: flex;\n flex-direction: column;\n vertical-align: top;\n width: 360px;\n max-width: 360px;\n min-width: 360px;\n position: relative;\n z-index: 10;\n /* Make the left cell scrollable. */\n overflow-y: auto;\n /* Don't show the the horizontal scrollbar that only appears when\n * the vertical scrollbar appears. */\n overflow-x: hidden;\n /* Keep the left cell scroll area within the viewport. (244px to account\n * for the header.) */\n max-height: calc(95vh - 244px);\n\n /* Border and gutter to make it more obvious how big the left cell is. */\n border: 1px solid var(--wb-semanticColor-core-border-neutral-default);\n margin-inline-end: 32px;\n}\n.perseus-editor-right-cell {\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n padding: 30px;\n padding-top: 5px;\n vertical-align: top;\n /* Make the right cell scrollable. */\n overflow-y: auto;\n /* Keep the left cell scroll area within the viewport. (244px to account\n * for the header.) */\n max-height: calc(95vh - 244px);\n /* Don't shrink below the preview's intrinsic width. We need this to\n * preserve the Tablet and Desktop preview widths. */\n flex-shrink: 0;\n /* Border to make it more obvious how big the left cell is. */\n border: 1px solid var(--wb-semanticColor-core-border-neutral-default);\n}\n.perseus-hint-editor .perseus-single-editor {\n margin-bottom: 5px;\n}\n.perseus-hint-editor .remove-hint {\n float: right;\n font-size: 13px;\n padding: 0 10px;\n}\n.perseus-hint-editor + div .perseus-hint-renderer {\n width: 100%;\n}\n.perseus-hint-editor + div .perseus-hint-renderer div.paragraph {\n margin: 0px 0px 22px 0px;\n}\n.perseus-hint-editor-actions {\n margin: 8px;\n margin-block-start: 0;\n}\n.perseus-article-editor {\n margin-bottom: 20px;\n margin-top: 20px;\n}\n.perseus-article-editor .section-control-button,\n.perseus-article-editor .step-control-button {\n font-size: 13px;\n padding: 2px 10px;\n margin: 0 2px;\n}\n.perseus-article-editor .perseus-editor-left-cell {\n min-width: 360px;\n}\n/* Pin the issues panel and section title to the top of the section's scroll\n * area so they stay visible while the author scrolls through that section's\n * content. */\n.perseus-article-editor\n .perseus-editor-left-cell\n > .perseus-editor-sticky-header {\n position: sticky;\n inset-block-start: 0;\n /* Draw above the section content that scrolls underneath it. */\n z-index: 1;\n /* Make the sticky element background opaque so text doesn't overlap\n * while scrolling. */\n background-color: var(--wb-semanticColor-core-background-base-default);\n /* A flex item won't shrink below its content by default, but it also\n * shouldn't stretch to fill the cell when the section is short. */\n flex-shrink: 0;\n}\n/* An expanded panel with many issues could otherwise cover the whole scroll\n * area, leaving nothing to scroll. Cap it and let the list scroll instead. */\n.perseus-article-editor\n .perseus-editor-sticky-header\n .perseus-widget-editor-panel {\n max-height: 40vh;\n overflow-y: auto;\n}\n.perseus-article-editor .mobile-preview,\n.perseus-article-editor .desktop-preview,\n.perseus-article-editor .editor-preview,\n.perseus-article-editor .standalone-preview {\n box-sizing: border-box;\n}\n.perseus-article-editor .mobile-preview {\n border: 1px solid rgba(0, 0, 0, 0.29);\n max-width: 322px;\n box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.29);\n padding: 32px 16px;\n}\n.perseus-article-editor .desktop-preview {\n border: 1px solid transparent;\n padding: 32px 20px;\n}\n.perseus-article-editor .editor-preview {\n border: 1px solid var(--wb-semanticColor-core-border-neutral-default);\n}\n.perseus-article-editor .editor-preview {\n /* Make the preview scrollable. */\n overflow-y: auto;\n /* Keep the left cell scroll area within the viewport. (244px to account\n * for the header.) */\n max-height: calc(95vh - 244px);\n /* Don't shrink below the preview's intrinsic width. We need this to\n * preserve the Tablet and Desktop preview widths. */\n flex-shrink: 0;\n}\n.perseus-article-editor .editor-preview.full-width {\n width: 100%;\n}\n.perseus-article-editor .editor-preview .desktop-preview {\n border: 1px solid rgba(0, 0, 0, 0.29);\n box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.29);\n width: 100%;\n}\n.perseus-article-editor .standalone-preview .mobile-preview,\n.perseus-article-editor .standalone-preview .desktop-preview {\n margin-left: auto;\n margin-right: auto;\n}\n.perseus-article-editor .json-editor {\n margin: auto;\n max-width: 688px;\n}\n.perseus-article-editor .perseus-json-editor {\n display: block;\n margin-left: auto;\n margin-right: auto;\n}\n.perseus-article-editor .json-editor-warning {\n margin-bottom: 10px;\n text-align: center;\n}\n.perseus-article-editor .framework-perseus.perseus-article {\n box-sizing: border-box;\n}\n.perseus-article-editor .framework-perseus.perseus-article * {\n box-sizing: inherit;\n}\n.perseus-article-editor .perseus-editor-sticky-header > .pod-title {\n padding: 4px 9px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n.perseus-widget-dropdown input[type=\"text\"] {\n border: 1px solid #ccc;\n border-radius: 5px;\n padding: 5px;\n}\n\n.perseus-widget-dropdown .dropdown-choices {\n margin: 20px 0;\n}\n.perseus-widget-dropdown .dropdown-choices .dropdown-choice {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 10px;\n margin-bottom: 10px;\n}\n\n.perseus-widget-dropdown .dropdown-info {\n display: inline-flex;\n margin-bottom: 16px;\n}\n.perseus-widget-dropdown .dropdown-field {\n display: flex;\n flex-direction: row;\n align-items: center;\n min-width: 0;\n margin-bottom: 16px;\n}\n.perseus-widget-dropdown .remove-choice {\n margin-bottom: 10px;\n}\n.perseus-input-number-editor {\n font-family: Lato, \"Noto Sans\", sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 20px;\n}\n.perseus-input-number-editor .answer-option .unsimplified-options {\n min-height: 48px;\n}\n.perseus-input-number-editor .perseus-textarea-pair {\n font-size: 16px;\n}\n.perseus-input-number-editor .perseus-textarea-pair .perseus-textarea-underlay {\n margin-bottom: 26px;\n}\n.perseus-input-number-editor .perseus-textarea-pair textarea {\n background-color: #ffffff;\n border: 1px solid rgba(33, 36, 44, 0.5);\n border-radius: 4px;\n}\n.perseus-input-number-editor .input-answer-editor-value,\n.perseus-input-number-editor .input-answer-editor-message {\n display: inline-block;\n}\n.perseus-input-number-editor .input-answer-editor-value-container {\n display: block;\n}\n.perseus-input-number-editor .input-answer-editor-value-container input {\n background: #ffffff;\n border: 1px solid rgba(33, 36, 44, 0.5);\n border-radius: 4px;\n color: #21242c;\n font-family: Lato, \"Noto Sans\", sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 20px;\n outline-offset: -2px;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container\n .numeric-input-value {\n margin-left: 8px;\n width: 6em;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container\n .max-error-input-value {\n display: none;\n width: 3em;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container\n .max-error-plusmn {\n cursor: default;\n display: none;\n height: 32px;\n padding-top: 4px;\n text-align: center;\n vertical-align: top;\n width: 1em;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container.with-max-error\n .numeric-input-value,\n.perseus-input-number-editor\n .input-answer-editor-value-container:focus-within\n .numeric-input-value {\n border-right: none;\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container.with-max-error\n .max-error-input-value,\n.perseus-input-number-editor\n .input-answer-editor-value-container:focus-within\n .max-error-input-value {\n border-left: none;\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n display: inline-block;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container.with-max-error\n .max-error-plusmn,\n.perseus-input-number-editor\n .input-answer-editor-value-container:focus-within\n .max-error-plusmn {\n border-top: 1px solid rgba(33, 36, 44, 0.5);\n border-bottom: 1px solid rgba(33, 36, 44, 0.5);\n display: inline-block;\n}\n.perseus-input-number-editor .options-toggle,\n.perseus-input-number-editor .answer-trash,\n.perseus-input-number-editor .answer-status {\n height: 26px;\n line-height: 26px;\n outline-offset: -3px;\n vertical-align: middle;\n}\n.perseus-input-number-editor .value-divider {\n border-top: 1px solid #ccc;\n}\n.perseus-input-number-editor .options-toggle,\n.perseus-input-number-editor .answer-trash {\n border-left: 1px solid #ccc;\n box-sizing: border-box;\n cursor: pointer;\n display: inline-block;\n text-align: center;\n text-decoration: none;\n width: 20%;\n}\n.perseus-input-number-editor .options-toggle {\n background-color: #eee;\n color: #444;\n}\n.perseus-input-number-editor .options-toggle:hover {\n background-color: #ccc;\n}\n.perseus-input-number-editor .answer-trash {\n background-color: #c04f03;\n background-image: linear-gradient(to bottom, #e35d04, #c04f03);\n color: #fff;\n}\n.perseus-input-number-editor .answer-trash:hover {\n color: #fff;\n background-image: linear-gradient(to bottom, #f46e15, #d16014);\n}\n.perseus-input-number-editor .is-strict-indicator {\n background-color: #d9edf7;\n border-bottom: 1px solid #ccc;\n border-right: 1px solid #ccc;\n cursor: default;\n font-size: 16px;\n line-height: 12px;\n height: 12px;\n width: 12px;\n text-align: center;\n position: absolute;\n top: 0;\n right: auto;\n bottom: auto;\n left: 0;\n -webkit-user-select: none;\n user-select: none;\n}\n.perseus-input-number-editor .simplify-indicator {\n border-top: 1px solid #ccc;\n border-right: 1px solid #ccc;\n cursor: default;\n font-size: 10px;\n line-height: 13px;\n height: 13px;\n width: 12px;\n text-align: center;\n position: absolute;\n top: 12px;\n right: auto;\n bottom: auto;\n left: 0;\n -webkit-user-select: none;\n user-select: none;\n}\n.perseus-input-number-editor .simplify-indicator.optional {\n background-color: #aaffaa;\n}\n.perseus-input-number-editor .simplify-indicator.enforced {\n background-color: #ffcccc;\n}\n.perseus-input-number-editor .answer-status {\n color: inherit;\n display: inline-block;\n text-align: center;\n text-decoration: none;\n width: 60%;\n -webkit-user-select: none;\n user-select: none;\n}\n.perseus-input-number-editor .answer-status.wrong {\n background-color: #ffcccc;\n}\n.perseus-input-number-editor .answer-status.correct {\n background-color: #aaffaa;\n}\n.perseus-input-number-editor .answer-status.ungraded {\n background-color: #d9edf7;\n}\n.perseus-input-number-editor .input-answer-editor-message {\n margin-left: 5px;\n}\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor {\n font-family: \"Lucida Grande\";\n width: 230px;\n}\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor\n .perseus-textarea-pair\n > textarea,\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor\n .perseus-textarea-underlay {\n padding: 5px;\n}\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor\n .perseus-textarea-pair {\n border-color: #ccc;\n border-radius: 3px;\n min-height: 53px;\n}\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor\n .perseus-textarea-underlay {\n margin-bottom: 0;\n}\n.perseus-widget-radio {\n margin-bottom: 10px;\n}\n.perseus-widget-radio .choice-editor .perseus-single-editor {\n margin-bottom: 0;\n}\n.perseus-widget-radio .choice-editor.correct textarea {\n background: #aaffaa;\n}\n.perseus-widget-radio .choice-editor.incorrect textarea {\n background: #ffcccc;\n}\n.perseus-widget-radio textarea::placeholder {\n color: #777;\n}\n.perseus-widget-radio .rationale-editor .perseus-textarea-pair {\n border-top: 0;\n}\n.perseus-widget-radio .choice-rationale-editors,\n.perseus-widget-radio .choice-editor,\n.perseus-widget-radio .rationale-editor {\n display: inline-block;\n width: 100%;\n}\n.perseus-widget-radio .perseus-single-editor {\n border: 0;\n display: inline-block;\n margin: 0 0 5px;\n vertical-align: top;\n}\n.perseus-widget-radio .perseus-single-editor p {\n margin: 0;\n}\n.perseus-widget-radio .perseus-textarea-pair,\n.perseus-widget-radio .perseus-textarea-underlay {\n /* Wrap when text area has a long image link that overflows. */\n overflow-wrap: anywhere;\n display: block;\n}\n.perseus-widget-radio .perseus-textarea-pair > textarea,\n.perseus-widget-radio .perseus-textarea-pair > .perseus-textarea-underlay {\n padding: 5px;\n}\n.perseus-widget-editor-content .add-choice-container .simple-button {\n margin-right: 10px;\n}\n.perseus-widget-editor-content .perseus-widget-radio {\n position: static;\n}\n.perseus-widget-editor-content .perseus-widget-radio .checkbox {\n position: relative;\n top: -10px;\n}\n.perseus-widget-editor-content .perseus-radio-option.none-of-above:before {\n content: \"None of the above\";\n display: block;\n font-style: italic;\n font-weight: bold;\n}\n.perseus-widget-editor-content\n .perseus-radio-option.none-of-above\n .choice-editor.incorrect {\n opacity: 0.5;\n}\n#solutionarea .perseus-widget-radio li {\n padding: 7px 0;\n}\n.framework-perseus\n table.perseus-widget-table-of-values\n th\n .perseus-single-editor {\n width: 80px;\n margin-bottom: 6px;\n}\n.framework-perseus\n table.perseus-widget-table-of-values\n th\n .perseus-textarea-pair,\n.framework-perseus\n table.perseus-widget-table-of-values\n th\n .perseus-single-editor {\n height: 50px;\n}\n.categorization-container.categorization-container-editor {\n width: 350px;\n margin-bottom: 160px;\n}\n.categorization-container.categorization-container-editor .card input {\n margin: 7px 3px 7px 13px;\n font-size: 12px;\n display: block;\n width: 81%;\n}\n.categorization-container.categorization-container-editor .category {\n float: left;\n padding: 5px;\n width: 160px;\n}\n.categorization-container.categorization-container-editor .categories {\n width: 176px;\n}\n.categorization-container.categorization-container-editor\n .perseus-textarea-underlay {\n margin-bottom: 0;\n}\n.categorization-container.categorization-container-editor .drag-bar {\n float: left;\n font-size: 10px;\n padding: 2px 0;\n height: 70%;\n margin-top: 3px;\n}\n.categorization-container.categorization-container-editor .header {\n margin-bottom: 8px;\n}\n.categorization-container.categorization-container-editor .header input {\n display: block;\n margin-right: 24px;\n width: 76%;\n}\n.categorization-container.categorization-container-editor .header .remove {\n position: relative;\n top: -14px;\n left: 12px;\n float: right;\n width: 20px;\n height: 20px;\n padding: 2px;\n color: #666;\n cursor: pointer;\n}\n.categorization-container.categorization-container-editor\n .header\n .remove:hover {\n color: #333;\n}\n.categorization-container.categorization-container-editor .delete-item-area {\n position: absolute;\n width: 150px;\n height: 60px;\n padding-top: 40px;\n bottom: -150px;\n left: 10px;\n border: dashed 2px #888;\n color: #888;\n text-align: center;\n font-size: 20px;\n}\n.categorization-container.categorization-container-editor\n .delete-item-area.target {\n border-color: black;\n color: #333;\n}\n.categorization-container.categorization-container-editor .card {\n width: 130px;\n padding: 0;\n}\n.categorization-container.categorization-container-editor\n .card.dragging\n .drag-bar {\n margin-left: 2px;\n}\n.categorization-editor-area {\n height: 30px;\n}\n.categorization-editor-area .add-item {\n float: left;\n margin-left: 17px;\n}\n.categorization-editor-area .add-category {\n margin-left: 173px;\n}\n.perseus-widget-interactive-graph {\n display: block;\n}\n.perseus-widget-plotter-editor .plotter-categories,\n.perseus-widget-plotter-editor .pic-url {\n width: 70%;\n}\n.perseus-text-list-editor input[type=\"text\"] {\n padding: 3px;\n margin-right: 5px;\n min-width: 20px;\n max-width: 340px;\n}\n.perseus-text-list-editor.layout-horizontal input[type=\"text\"] {\n float: left;\n}\n.perseus-matcher-editor .perseus-text-list-editor {\n float: left;\n max-width: 50%;\n}\n.perseus-matcher-editor .perseus-text-list-editor input[type=\"text\"] {\n max-width: 90%;\n}\n.perseus-matcher-editor input[type=\"text\"] {\n width: 46%;\n}\n.perseus-matcher-editor input[type=\"text\"] + input[type=\"text\"] {\n margin-left: 2%;\n}\n.info-tip {\n display: inline-block;\n}\n.info-tip-content-container p {\n font-size: 12px;\n line-height: 1.4;\n margin: 0;\n}\n.info-tip-content-container p + p {\n margin-top: 22px;\n}\n.perseus-widget-interaction-editor\n .perseus-widget-interaction-editor-select-element {\n background-color: #eee;\n border: 1px solid #ddd;\n border-top: 0;\n border-radius: 0 0 3px 3px;\n padding: 5px 10px;\n margin: 20px -11px -11px -11px;\n}\n.perseus-widget-interaction-editor .colorpicker-circle {\n border-radius: 50%;\n width: 14px;\n height: 14px;\n position: absolute;\n left: 5px;\n top: 5px;\n}\n.perseus-interaction-element {\n border: 1px solid #ddd;\n border-radius: 3px;\n}\n.perseus-interaction-element .perseus-interaction-element-title {\n background-color: #eee;\n border: 1px solid #ddd;\n border-bottom: 0;\n font-size: 1.25em;\n padding: 4px 10px;\n border-radius: 3px 3px 0 0;\n border: 0;\n color: inherit;\n display: block;\n text-decoration: none;\n white-space: nowrap;\n font-size: 1em;\n overflow: hidden;\n}\n.perseus-interaction-element .perseus-interaction-element-title.closed {\n border-radius: 3px;\n}\n.perseus-interaction-element .perseus-interaction-element-title > svg {\n float: left;\n font-size: 14px;\n margin-right: 10px;\n}\n.perseus-interaction-element .perseus-interaction-element-content {\n border-radius: 0 0 3px 3px;\n border-top: 1px solid #ddd;\n padding: 10px;\n}\n.perseus-interaction-element\n .perseus-interaction-element-content\n .edit-controls {\n text-align: right;\n margin-top: -30px;\n}\n.perseus-interaction-element\n .perseus-interaction-element-content\n .edit-controls\n > button {\n background: #fff;\n border: 0;\n cursor: pointer;\n padding: 0;\n margin-left: 7px;\n font-size: 18px;\n color: #555;\n}\n.perseus-interaction-element .perseus-interaction-element-content.leave {\n display: none;\n}\n.button-set-separator {\n margin: 10px 0;\n}\n.perseus-widget-editor .unit-radio {\n color: black;\n text-decoration: none;\n}\n.unit-example-not-okay {\n color: red;\n}\n.unit-example-okay {\n color: green;\n}\n.pair-editor input {\n width: 120px;\n}\n.marvel-device.iphone6.silver:after {\n z-index: 1;\n}\n.perseus-diff {\n margin: 0 10px;\n}\n.perseus-diff .diff-header {\n font-size: 18px;\n padding: 10px 0;\n width: 50%;\n display: inline-block;\n}\n.perseus-diff .diff-header.collapsed {\n font-size: 14px;\n padding: 0px;\n}\n.perseus-diff .diff-body {\n border-top: 1px solid #e4e4e4;\n border-bottom: 1px solid #e4e4e4;\n}\n.perseus-diff .diff-row {\n width: 50%;\n white-space: pre-wrap;\n box-sizing: border-box;\n font-size: 14px;\n padding-right: 20px;\n padding-left: 10px;\n overflow: hidden;\n}\n.perseus-diff .diff-row.collapsed {\n color: #888;\n cursor: pointer;\n}\n.perseus-diff .diff-row.collapsed:hover {\n color: #666;\n}\n.perseus-diff .diff-row.collapsed:active {\n color: #444;\n}\n.perseus-diff .diff-row .diff-line {\n margin-bottom: 20px;\n}\n.perseus-diff .before {\n float: left;\n border-left: 1px solid #e4e4e4;\n}\n.perseus-diff .after {\n float: right;\n border-right: 1px solid #e4e4e4;\n border-left: 1px solid #e4e4e4;\n}\n.perseus-diff .inner-value {\n height: 100%;\n padding: 3px;\n}\n.perseus-diff .not-present {\n display: none;\n}\n.perseus-diff .blank-space {\n visibility: hidden;\n}\n.perseus-diff .added {\n background-color: #eeffee;\n}\n.perseus-diff .added.dark {\n background-color: #aaffaa;\n}\n.perseus-diff .removed {\n background-color: #ffeeee;\n}\n.perseus-diff .removed.dark {\n background-color: #ffaaaa;\n}\n.perseus-diff .image {\n display: inline-block;\n margin-left: 20px;\n margin-bottom: 10px;\n}\n.perseus-diff .image,\n.perseus-diff .image > div,\n.perseus-diff .image > img {\n max-height: 300px;\n max-width: 100%;\n}\n.perseus-diff .image-unchanged {\n border: 1px solid #aaaaaa;\n}\n.perseus-diff .image-added {\n border: 2px solid #aaffaa;\n}\n.perseus-diff .image-removed {\n border: 2px solid #ffaaaa;\n}\n.perseus-diff .diff-separator {\n border-bottom: 1px dashed #444;\n margin: 30px 0 10px 0;\n}\n/* Reset fieldset min-width as our editors include a fieldset element\nnested within a table cell, which results in native browser styling that\nbreaks the layout depending on the widget editors used.*/\n/* TODO(benchristel): this is the only usage of .perseus-editor-table. Use a\n * different selector here, then remove the perseus-editor-table class.\n */\n.perseus-editor-table fieldset {\n min-inline-size: 0;\n min-width: 0;\n}\n/**\n * Disabled Editing Mode Styles\n *\n * Applied when editingDisabled=true to prevent content creators from making\n * changes while still allowing them to view the editor interface.\n *\n * Targets all form controls and interactive elements within disabled editors.\n */\n.perseus-single-editor.perseus-editor-disabled input,\n.perseus-single-editor.perseus-editor-disabled select,\n.perseus-single-editor.perseus-editor-disabled .perseus-math-input,\n.perseus-single-editor.perseus-editor-disabled .keypad-input {\n background-color: var(\n --wb-semanticColor-input-disabled-background\n ) !important;\n cursor: not-allowed !important;\n border-color: var(--wb-semanticColor-input-disabled-border) !important;\n}\n\n/* The markdown field renders widget-reference highlights in a transparent\n underlay that sits behind the textarea, so tint the container — not the\n textarea — to keep the highlights visible while still reading as disabled. */\n.perseus-single-editor.perseus-editor-disabled .perseus-textarea-pair {\n background-color: var(\n --wb-semanticColor-input-disabled-background\n ) !important;\n border-color: var(--wb-semanticColor-input-disabled-border) !important;\n cursor: not-allowed !important;\n}\n\n/* Plotter is a special case due to the archaic graphie implementation. */\n.perseus-editor-disabled .perseus-widget-plotter {\n pointer-events: none;\n}\n",".padded-x {\n padding-left: var(--wb-sizing-size_080);\n padding-right: var(--wb-sizing-size_080);\n}\n\n.padded-y {\n padding-top: var(--wb-sizing-size_060);\n padding-bottom: var(--wb-sizing-size_060);\n}\n\n.answer-option {\n border: 1px solid #ddd;\n border-radius: 3px;\n display: flex;\n flex-direction: column;\n}\n\n.button-row {\n display: flex;\n gap: var(--wb-sizing-size_120);\n}\n\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.button-sets {\n text-transform: uppercase !important;\n}\n\n.answers-subtitle {\n font-style: italic !important;\n}\n\n.answers-group {\n gap: var(--wb-sizing-size_120) !important;\n}\n\n.answers-list {\n gap: var(--wb-sizing-size_080) !important;\n}\n\n.delete-button {\n padding-inline: var(--wb-sizing-size_160) !important;\n}\n",".title {\n font-size: 18px;\n font-weight: bold;\n}\n\n.input {\n font-size: 18px;\n}\n\n.hints-title {\n margin-top: var(--wb-sizing-size_100);\n font-size: 110%;\n font-weight: bold;\n}\n",".dimensions-container {\n display: flex;\n flex-direction: column;\n align-items: start;\n background-color: var(\n --wb-semanticColor-core-background-instructive-subtle\n );\n border: 1px solid var(--wb-semanticColor-core-border-base-subtle);\n border-radius: var(--wb-sizing-size_080);\n margin-block-start: var(--wb-sizing-size_080);\n margin-block-end: var(--wb-sizing-size_120);\n padding: var(--wb-sizing-size_080);\n}\n\n.dimensions-field-container {\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n\n.x-span {\n display: block;\n margin-inline: var(--wb-sizing-size_080);\n}\n\n.horizontal-line {\n width: 100%;\n height: 1px;\n background-color: var(--wb-semanticColor-core-background-neutral-default);\n margin-block: var(--wb-sizing-size_080);\n}\n\n.alt-text-field-container {\n /* Relative position so that the character counter child element\n can be positioned absolutely. */\n position: relative;\n /* Padding to make space for the character counter. */\n padding-bottom: var(--wb-sizing-size_120);\n}\n",".dark-mode-toggle-container {\n display: flex;\n flex-direction: column;\n gap: 0.8rem;\n margin-block-end: 0.8rem;\n}\n.dark-mode-suppression-container {\n display: flex;\n flex-direction: row;\n gap: 0.4rem;\n align-items: center;\n}\n",".decorative-toggle-container {\n margin-block-end: var(--wb-sizing-size_080);\n}\n\n.flex-row {\n display: flex;\n align-items: center;\n gap: var(--wb-sizing-size_040);\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n\n/* inline-flex so the (single-select) group flows inline with adjacent\n * labels/badges (e.g. the \"Status\" label) instead of wrapping onto its own\n * line. It stays cohesive — its segments never split across lines; the whole\n * group wraps below the label as a unit if there isn't room. */\n.group {\n display: inline-flex !important;\n flex-direction: row !important;\n align-items: center !important;\n vertical-align: middle !important;\n gap: var(--wb-sizing-size_080) !important;\n}\n\n/* Multi-select group: wraps onto multiple rows as an aligned grid with\n * consistent row + column gaps. Stretch to the full available width so it only\n * wraps when the segments genuinely don't fit on one line (not because a flex\n * parent shrank it to content width). */\n.wrap-group {\n display: flex !important;\n flex-direction: row !important;\n flex-wrap: wrap !important;\n align-items: center !important;\n align-self: stretch !important;\n gap: var(--wb-sizing-size_080) !important;\n}\n\n/* The segment IS the Clickable's <button>. Clickable already inherits the font,\n * resets the text decoration, and sets the cursor (pointer / not-allowed when\n * disabled); here we add the visual box. Its variants are driven by selectors\n * below — selected via `[aria-checked=\"true\"]`, disabled via `[aria-disabled]`,\n * hover via `:hover` — so the markup needs only this one static class. The\n * keyboard focus ring is a rounded box-shadow (follows the border radius, unlike\n * `outline`) shown only on `:focus-visible` so it doesn't appear after a click. */\n.segment {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n justify-content: center !important;\n padding-block: var(--wb-sizing-size_040) !important;\n padding-inline: var(--wb-sizing-size_120) !important;\n border-radius: var(--wb-border-radius-radius_040) !important;\n border: var(--wb-border-width-thin) solid\n var(--wb-semanticColor-core-border-neutral-subtle) !important;\n background-color: var(\n --wb-semanticColor-core-background-base-default\n ) !important;\n color: var(--wb-semanticColor-core-foreground-neutral-strong) !important;\n font-size: var(--wb-font-body-size-small) !important;\n line-height: var(--wb-font-body-lineHeight-small) !important;\n white-space: nowrap !important;\n}\n\n.segment:focus-visible {\n outline: none !important;\n box-shadow: 0 0 0 var(--wb-border-width-medium)\n var(--wb-semanticColor-focus-outer) !important;\n}\n\n/* Hover only when interactive and not already selected. */\n.segment:not([aria-disabled=\"true\"]):not([aria-checked=\"true\"]):hover {\n border-color: var(\n --wb-semanticColor-core-border-neutral-default\n ) !important;\n background-color: var(\n --wb-semanticColor-core-background-neutral-subtle\n ) !important;\n}\n\n.segment[aria-checked=\"true\"] {\n background-color: var(\n --wb-semanticColor-core-background-instructive-default\n ) !important;\n border-color: var(\n --wb-semanticColor-core-background-instructive-default\n ) !important;\n color: var(--wb-semanticColor-core-foreground-knockout-default) !important;\n}\n\n.segment[aria-disabled=\"true\"] {\n background-color: var(\n --wb-semanticColor-core-background-disabled-subtle\n ) !important;\n border-color: var(\n --wb-semanticColor-core-border-disabled-default\n ) !important;\n color: var(--wb-semanticColor-core-foreground-disabled-default) !important;\n}\n\n.segment[aria-disabled=\"true\"][aria-checked=\"true\"] {\n background-color: var(\n --wb-semanticColor-core-background-disabled-strong\n ) !important;\n border-color: var(\n --wb-semanticColor-core-background-disabled-strong\n ) !important;\n color: var(--wb-semanticColor-core-foreground-disabled-strong) !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n\n.field {\n margin-block: var(--wb-sizing-size_120) !important;\n gap: var(--wb-sizing-size_080) !important;\n align-items: flex-start !important;\n}\n\n/* Label + InfoTip on one line. */\n.label-row {\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_040) !important;\n}\n\n/* A label whose control sits inline beside it (e.g. \"User input\"). */\n.inline-field {\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_080) !important;\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.single-select-short {\n /* Non-standard spacing, but it's the smallest we can go\n without running into styling issues with the dropdown. */\n height: 26px !important;\n}\n\n.row {\n display: flex !important;\n flex-direction: row !important;\n margin-top: 8px !important;\n align-items: center !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.container {\n /* gap is for the vertical spacing between the captions and fields,\n * while padding-top restores the space above the first caption\n * this replaces the deprecated Strut spacing style */\n gap: var(--wb-sizing-size_120) !important;\n padding-top: var(--wb-sizing-size_060) !important;\n}\n\n.caption {\n color: var(--wb-semanticColor-core-foreground-neutral-subtle) !important;\n}\n",".background-url-input {\n border: 1px solid var(--wb-semanticColor-core-border-neutral-subtle);\n border-radius: var(--wb-sizing-size_040);\n padding: var(--wb-sizing-size_040);\n}\n\n/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.checkbox-row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n justify-content: space-between !important;\n margin-bottom: var(--wb-sizing-size_080) !important;\n}\n\n.protractor-section {\n margin-top: var(--wb-sizing-size_080) !important;\n padding-top: var(--wb-sizing-size_080) !important;\n padding-bottom: var(--wb-sizing-size_080) !important;\n border-top: 1px solid var(--wb-semanticColor-core-border-neutral-subtle) !important;\n border-bottom: 1px solid var(--wb-semanticColor-core-border-neutral-subtle) !important;\n}\n",".tree-list {\n list-style: revert;\n margin-left: var(--wb-sizing-size_080);\n}\n\n.indent-list {\n list-style: revert;\n margin-left: var(--wb-sizing-size_120);\n}\n\n/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.switch-row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_080) !important;\n margin-top: var(--wb-sizing-size_080) !important;\n margin-bottom: var(--wb-sizing-size_080) !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.switch-row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_080) !important;\n margin-top: var(--wb-sizing-size_120) !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.container {\n margin-top: var(--wb-sizing-size_080) !important;\n}\n\n.add-element-select {\n background-color: var(\n --wb-semanticColor-core-background-instructive-subtle\n ) !important;\n border-radius: var(--wb-sizing-size_040) !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.container {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_160) !important;\n}\n\n.label {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_060) !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_060) !important;\n /* Set minWidth to \"auto\" to prevent the component from bleeding */\n /* into the margins. (minWidth is 0 by default.) */\n min-width: auto !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.line-weight-select {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_040) !important;\n /* Allow truncation, stop bleeding over the edge. */\n min-width: 0 !important;\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n}\n\n/* gap replaces the spacer that separated the header label from its swatch. */\n.header {\n gap: var(--wb-sizing-size_080) !important;\n}\n\n.space-under {\n margin-bottom: var(--wb-sizing-size_080) !important;\n}\n\n.color-row {\n margin-top: var(--wb-sizing-size_080) !important;\n margin-bottom: var(--wb-sizing-size_080) !important;\n /* gap replaces the spacer between the color select and the fill control. */\n gap: var(--wb-sizing-size_160) !important;\n}\n\n/* gap replaces the spacer between the \"fill\" label and its select. */\n.fill-label {\n gap: var(--wb-sizing-size_060) !important;\n}\n\n.truncated-width {\n /* Allow truncation, stop bleeding over the edge. */\n min-width: 0 !important;\n}\n\n.add-button {\n align-self: start !important;\n}\n\n.horizontal-rule {\n height: 1px !important;\n background-color: var(\n --wb-semanticColor-core-border-neutral-subtle\n ) !important;\n}\n\n/* Top spacing for a section start (a divider opening a section, or a heading). */\n.section-top {\n margin-top: var(--wb-sizing-size_120) !important;\n}\n\n/* A divider that hugs the content directly above it. */\n.divider-tight {\n margin-top: var(--wb-sizing-size_040) !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.container {\n display: flex !important;\n flex-direction: column !important;\n gap: var(--wb-sizing-size_060) !important;\n padding-top: var(--wb-sizing-size_080) !important;\n}\n\n.row {\n flex-direction: row !important;\n align-items: center !important;\n}\n\n.button {\n align-self: start !important;\n margin-top: calc(-1 * var(--wb-sizing-size_060)) !important;\n}\n\n.caption {\n color: var(--wb-semanticColor-core-foreground-neutral-subtle) !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.container {\n width: 100% !important;\n flex-direction: row !important;\n align-items: center !important;\n margin-top: var(--wb-sizing-size_040) !important;\n}\n\n.delete-button {\n /* Line up the delete icon with the rest of the content. */\n margin-inline-start: calc(-1 * var(--wb-sizing-size_040)) !important;\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.accordion-header-container {\n /* Stop the label summary from wrapping. */\n white-space: nowrap !important;\n}\n\n.accordion-header {\n padding: var(--wb-sizing-size_040) !important;\n margin-inline-end: var(--wb-sizing-size_080) !important;\n border-radius: var(--wb-sizing-size_040) !important;\n text-overflow: ellipsis !important;\n overflow: hidden !important;\n background-color: var(\n --wb-semanticColor-core-background-base-default\n ) !important;\n}\n\n.row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n /* Allow truncation, stop bleeding over the edge. */\n min-width: 0 !important;\n}\n\n/* gap replaces the spacer that separated the header label from its swatch. */\n.header {\n gap: var(--wb-sizing-size_080) !important;\n}\n\n/* The \"text\" label row: grow to fill, with a gap before the text field. */\n.text-label {\n margin-bottom: var(--wb-sizing-size_080) !important;\n flex-grow: 1 !important;\n gap: var(--wb-sizing-size_080) !important;\n}\n\n/* gap between the color select and the size control. */\n.color-row {\n gap: var(--wb-sizing-size_160) !important;\n}\n\n/* gap replaces the spacer between the \"size\" label and its select. */\n.size-label {\n gap: var(--wb-sizing-size_080) !important;\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n\n.accordion-header {\n text-overflow: ellipsis !important;\n /* A maximum width needs to be specified in order for the ellipsis to work. */\n /* The 64px in the calculation accounts for the line swatch (56px) and the preceding strut (8px). */\n /* Margin and padding won't work here because they would create space between the header text and the swatch. */\n max-width: calc(100% - 64px) !important;\n overflow: hidden !important;\n white-space: nowrap !important;\n}\n\n.axis-menu {\n min-width: auto !important;\n}\n\n.copy-paste-button {\n flex-shrink: 0 !important;\n margin: 0 2px !important;\n}\n\n.domain-min {\n justify-content: space-between !important;\n /* The 'width' property is applied to the label, which wraps the text and the input field. */\n /* The width of the input fields (min/max) should be the same (to have a consistent look), */\n /* so the following calculation distributes the space accordingly. */\n /* For the \"domain/range min\" block, the text is 82.7px, and the strut is 6px (88.7px total). */\n /* The \"domain/range max\" block is 30.23px, and the strut is 6px (36.23px total). */\n /* The calculation takes the remain space after the text & struts (141px total) are removed, */\n /* and divides it between the two input fields equally. */\n /* The calculation reads: \"Take 1/2 of the non-text space, and add the required space for this label's text\" */\n width: calc(((100% - 141px) / 2) + 88.7px) !important;\n text-wrap: nowrap !important;\n}\n\n.domain-max {\n /* See explanation for \"domainMin\" for the calculation below. */\n width: calc(((100% - 141px) / 2) + 36.2px) !important;\n}\n\n.dropdown-label {\n align-items: center !important;\n display: flex !important;\n /* gap replaces the spacer between the label text and its control. */\n gap: var(--wb-sizing-size_060) !important;\n}\n\n/* Plain <ul> element, no !important needed. */\n.example-container {\n background: white;\n border: 1px solid var(--wb-semanticColor-core-border-neutral-subtle);\n border-radius: 4px;\n flex-grow: 1;\n list-style-type: none;\n /* Nothing special about the maxHeight value, */\n /* just a good height to partially show a 3rd example in the list */\n /* to hint at scrollable content. */\n max-height: 88px;\n margin: 8px 0 0 0;\n overflow-y: scroll;\n padding: 4px 12px 4px 4px;\n}\n\n.example-content {\n font-family: \"Lato\", sans-serif !important;\n flex-grow: 1 !important;\n color: var(--wb-semanticColor-core-foreground-neutral-strong) !important;\n}\n\n/* Plain <li> element, no !important needed. */\n.example-row {\n align-items: center;\n display: flex;\n flex-direction: row;\n min-height: 44px;\n}\n\n.row-space {\n margin-top: var(--wb-sizing-size_080) !important;\n}\n\n.row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n}\n\n/* gap replaces the spacer that separated the header label from its swatch. */\n.header {\n gap: var(--wb-sizing-size_080) !important;\n}\n\n/* Color/stroke row: gap between controls, with spacing below the row. */\n.color-row {\n margin-bottom: var(--wb-sizing-size_080) !important;\n gap: var(--wb-sizing-size_120) !important;\n}\n\n/* gap between the directional-axis dropdown and the equation field. */\n.axis-row {\n gap: var(--wb-sizing-size_080) !important;\n}\n\n/* gap between the domain min and max controls. */\n.domain-row {\n gap: var(--wb-sizing-size_160) !important;\n}\n\n/* Label settings styles */\n.add-button {\n align-self: start !important;\n}\n\n.horizontal-rule {\n height: 1px !important;\n background-color: var(\n --wb-semanticColor-core-border-neutral-subtle\n ) !important;\n}\n\n/* Top spacing for a section start (a divider opening a section, or a heading). */\n.section-top {\n margin-top: var(--wb-sizing-size_120) !important;\n}\n\n/* A divider that hugs the content directly above it. */\n.divider-tight {\n margin-top: var(--wb-sizing-size_040) !important;\n}\n\n/* Indent for the example content text beside the copy/paste buttons. */\n.example-content-indent {\n margin-inline-start: var(--wb-sizing-size_040) !important;\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n}\n\n/* gap replaces the spacer that separated the header label from its swatch. */\n.header {\n gap: var(--wb-sizing-size_080) !important;\n}\n\n.space-under {\n margin-bottom: var(--wb-sizing-size_080) !important;\n}\n\n/* gap between the \"kind\" label and its select. */\n.kind-label {\n gap: var(--wb-sizing-size_040) !important;\n}\n\n/* gap between the color select and the line style select. */\n.color-row {\n gap: var(--wb-sizing-size_120) !important;\n}\n\n.error-text {\n color: var(--wb-semanticColor-core-foreground-critical-default) !important;\n}\n\n.add-button {\n align-self: start !important;\n}\n\n.horizontal-rule {\n height: 1px !important;\n background-color: var(\n --wb-semanticColor-core-border-neutral-subtle\n ) !important;\n}\n\n/* Top spacing for a section start (a divider opening a section, or a heading). */\n.section-top {\n margin-top: var(--wb-sizing-size_120) !important;\n}\n\n/* A divider that hugs the content directly above it. */\n.divider-tight {\n margin-top: var(--wb-sizing-size_040) !important;\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.row {\n flex-direction: row !important;\n align-items: center !important;\n /* gap replaces the Strut that separated the header label from its swatch. */\n gap: var(--wb-sizing-size_080) !important;\n}\n\n.add-button {\n align-self: start !important;\n}\n\n.horizontal-rule {\n height: 1px !important;\n background-color: var(\n --wb-semanticColor-core-border-neutral-subtle\n ) !important;\n}\n\n/* Top spacing for a section start (a divider opening a section, or a heading). */\n.section-top {\n margin-top: var(--wb-sizing-size_120) !important;\n}\n\n/* A divider that hugs the content directly above it. */\n.divider-tight {\n margin-top: var(--wb-sizing-size_040) !important;\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n}\n\n/* gap replaces the spacer that separated the header label from its swatch. */\n.header {\n gap: var(--wb-sizing-size_080) !important;\n}\n\n.space-under {\n margin-bottom: var(--wb-sizing-size_080) !important;\n}\n\n.color-row {\n margin-bottom: var(--wb-sizing-size_080) !important;\n /* gap replaces the spacer between the color select and the fill control. */\n gap: var(--wb-sizing-size_160) !important;\n}\n\n/* gap replaces the spacer between the \"fill\" label and its select. */\n.fill-label {\n gap: var(--wb-sizing-size_060) !important;\n}\n\n.icon {\n margin-inline-start: var(--wb-sizing-size_040) !important;\n}\n\n.polygon-actions-container {\n width: 100% !important;\n}\n\n.movement-buttons-container {\n display: flex !important;\n flex-direction: column !important;\n align-items: center !important;\n min-width: fit-content !important;\n}\n\n.truncated-width {\n /* Allow truncation, stop bleeding over the edge. */\n min-width: 0 !important;\n}\n\n.add-button {\n align-self: start !important;\n}\n\n.horizontal-rule {\n height: 1px !important;\n background-color: var(\n --wb-semanticColor-core-border-neutral-subtle\n ) !important;\n}\n\n/* Top spacing for a section start (a divider opening a section, or a heading). */\n.section-top {\n margin-top: var(--wb-sizing-size_120) !important;\n}\n\n/* A divider that hugs the content directly above it. */\n.divider-tight {\n margin-top: var(--wb-sizing-size_040) !important;\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.row {\n flex-direction: row !important;\n align-items: center !important;\n /* gap replaces the Strut that separated the header label from its swatch. */\n gap: var(--wb-sizing-size_080) !important;\n}\n\n.error-text {\n color: var(--wb-semanticColor-core-foreground-critical-default) !important;\n margin-top: var(--wb-sizing-size_080) !important;\n}\n\n.add-button {\n align-self: start !important;\n}\n\n.horizontal-rule {\n height: 1px !important;\n background-color: var(\n --wb-semanticColor-core-border-neutral-subtle\n ) !important;\n}\n\n/* Top spacing for a section start (a divider opening a section, or a heading). */\n.section-top {\n margin-top: var(--wb-sizing-size_120) !important;\n}\n\n/* A divider that hugs the content directly above it. */\n.divider-tight {\n margin-top: var(--wb-sizing-size_040) !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.button-container {\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_120) !important;\n}\n\n.button {\n margin-top: var(--wb-sizing-size_080) !important;\n flex-grow: 1 !important;\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.tile {\n display: flex !important;\n flex-direction: column !important;\n gap: var(--wb-sizing-size_120) !important;\n background-color: var(\n --wb-semanticColor-core-background-instructive-subtle\n ) !important;\n margin-top: var(--wb-sizing-size_080) !important;\n padding: var(--wb-sizing-size_120) !important;\n border-radius: var(--wb-sizing-size_080) !important;\n}\n\n.tile-row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_120) !important;\n background-color: var(\n --wb-semanticColor-core-background-instructive-subtle\n ) !important;\n margin-top: var(--wb-sizing-size_080) !important;\n padding: var(--wb-sizing-size_120) !important;\n border-radius: var(--wb-sizing-size_080) !important;\n}\n\n.label-field {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_060) !important;\n}\n\n.label-prefix {\n display: inline-block !important;\n min-inline-size: var(--wb-sizing-size_400) !important;\n text-align: right !important;\n}\n\n.text-field-wrapper {\n inline-size: var(--wb-sizing-size_800) !important;\n}\n\n.point-label-field {\n inline-size: var(--wb-sizing-size_640) !important;\n}\n\n.equationSection {\n margin-top: var(--wb-sizing-size_120) !important;\n}\n\n.equationBody {\n background-color: var(\n --wb-semanticColor-core-background-neutral-subtle\n ) !important;\n border: var(--wb-border-width-thin) solid\n var(--wb-semanticColor-core-border-neutral-subtle) !important;\n margin-top: var(--wb-sizing-size_080) !important;\n padding-left: var(--wb-sizing-size_080) !important;\n padding-right: var(--wb-sizing-size_080) !important;\n font-size: var(--wb-font-body-size-xsmall) !important;\n}\n\n.reset-button {\n margin-top: var(--wb-sizing-size_120) !important;\n}\n",".answers {\n margin-top: var(--wb-sizing-size_080);\n margin-bottom: var(--wb-sizing-size_120);\n}\n\n.answer {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--wb-sizing-size_160);\n}\n\n.add-answer-content {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--wb-sizing-size_160);\n color: var(--wb-semanticColor-link-rest);\n}\n\n.add-answer:hover .add-answer-content {\n text-decoration: underline;\n}\n\n.remove-button-content {\n display: inline-flex;\n color: var(--wb-semanticColor-core-foreground-critical-default);\n}\n\n.add-answer[aria-disabled=\"true\"],\n.remove-button[aria-disabled=\"true\"] {\n opacity: 0.5;\n}\n\n.add-answer:focus:not(:focus-visible),\n.remove-button:focus:not(:focus-visible) {\n outline: none;\n}\n\n.answer:not(:first-child) {\n margin-top: var(--wb-sizing-size_120);\n}\n",".options-list {\n margin-top: var(--wb-sizing-size_080);\n}\n\n.option {\n display: flex;\n padding: var(--wb-sizing-size_060) var(--wb-sizing-size_0);\n}\n\n.label {\n /* TODO: could we use WB typography? */\n font-family: inherit;\n font-size: 15px;\n line-height: 1.25;\n margin-left: var(--wb-sizing-size_160);\n color: #626569; /* gray17 */\n}\n\n.selectLabel {\n margin-right: var(--wb-sizing-size_080);\n}\n\n.editor {\n display: flex;\n flex-direction: column;\n gap: var(--wb-sizing-size_080);\n}\n",".image-row {\n display: flex;\n gap: var(--wb-sizing-size_160);\n margin-top: var(--wb-sizing-size_080);\n}\n",".tile {\n display: flex;\n flex-direction: column;\n background-color: var(\n --wb-semanticColor-core-background-instructive-subtle\n );\n border: 1px solid var(--wb-semanticColor-core-border-neutral-subtle);\n border-radius: var(--wb-sizing-size_120);\n padding-inline: var(--wb-sizing-size_120);\n padding-block: var(--wb-sizing-size_080);\n margin-block-start: var(--wb-sizing-size_120);\n margin-block-end: var(--wb-sizing-size_120);\n}\n\n.status-row {\n display: flex;\n flex-direction: row;\n align-items: center;\n flex-wrap: wrap;\n gap: var(--wb-sizing-size_080);\n margin-block-end: var(--wb-sizing-size_080);\n}\n\n.radio-option-actions-container {\n display: flex;\n flex-direction: row;\n align-items: center;\n margin-block-start: var(--wb-sizing-size_080);\n}\n\n.button-row {\n display: flex;\n flex-direction: row;\n align-items: center;\n margin-block-start: var(--wb-sizing-size_080);\n}\n\n.image-editor-container {\n display: flex;\n flex-direction: column;\n position: relative;\n padding: var(--wb-sizing-size_080);\n padding-block-start: var(--wb-sizing-size_240);\n border: 1px solid var(--wb-semanticColor-core-border-neutral-default);\n border-radius: var(--wb-sizing-size_080);\n margin-block-start: var(--wb-sizing-size_080);\n background-color: var(--wb-semanticColor-core-background-base-default);\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n\n/* A card's text sits on one line with the controls that reorder and remove it,\n so the controls stay next to the card they act on. */\n.card {\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_040) !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n\n/* Separates the three sections (cards, layout, padding) from each other. */\n.editor {\n gap: var(--wb-sizing-size_240) !important;\n}\n\n/* Separates a section's label from the control it describes. Smaller than the\n gap between sections so each label groups with its own control. */\n.section {\n gap: var(--wb-sizing-size_080) !important;\n}\n\n/* The cards always stack in the editor, regardless of the `layout` option,\n which only controls how the widget renders for students. */\n.cards {\n list-style: none !important;\n padding-inline-start: 0 !important;\n /* Drop the browser's default list margins; `section` and `editor` above\n own the spacing around the list. */\n margin-block: 0 !important;\n gap: var(--wb-sizing-size_120) !important;\n}\n\n/* Keep the button hugging its label rather than stretching to the width of the\n cards above it. */\n.add-card {\n align-self: flex-start !important;\n}\n"]}
1
+ {"version":3,"sources":["widget-editor-settings.css","perseus-editor.css","expression-editor.module.css","graded-group-editor.module.css","image-editor.module.css","dark-mode-toggle.module.css","decorative-toggle.module.css","segmented-control.module.css","numeric-input-editor.module.css","interactive-graph-editor.module.css","interactive-graph-description.module.css","interactive-graph-settings.module.css","interactive-graph-sr-tree.module.css","show-point-labels-toggle.module.css","locked-figure-select.module.css","coordinate-pair-input.module.css","color-select.module.css","line-weight-select.module.css","locked-ellipse-settings.module.css","locked-figure-aria.module.css","locked-figure-settings-actions.module.css","locked-label-settings.module.css","locked-function-settings.module.css","locked-line-settings.module.css","locked-point-settings.module.css","locked-polygon-settings.module.css","locked-vector-settings.module.css","locked-figures-section.module.css","start-coords-shared.module.css","answer-choices.module.css","label-image-editor.module.css","select-image.module.css","radio-editor.module.css","card-editor.module.css","sorter-editor.module.css"],"names":[],"mappings":"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","file":"index.css","sourcesContent":["/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.widget-editor-settings-container {\n padding-inline: var(--wb-sizing-size_120) !important;\n padding-block-start: var(--wb-sizing-size_120) !important;\n}\n\n.best-practices-container {\n margin-block-end: var(--wb-sizing-size_060) !important;\n}\n","code {\n font-family: Courier, monospace;\n}\n.pod-title {\n background-color: #eee;\n border: 1px solid #ddd;\n border-bottom: 0;\n font-size: 1.25em;\n padding: 4px 10px;\n border-radius: 3px 3px 0 0;\n}\n/* Pin the \"Question\", \"Question extras\", and \"Hint\" titles to the top of their\n * left cell, which is the scroll container. */\n.perseus-editor-left-cell > .pod-title,\n.perseus-editor-left-cell > .perseus-hint-editor > .pod-title {\n position: sticky;\n inset-block-start: 0;\n /* Draw above the editor content that scrolls underneath. */\n z-index: 1;\n}\n.pod-title.closed {\n border-radius: 3px;\n}\n.smiley {\n position: absolute;\n left: 0px;\n top: 4px;\n}\n.perseus-single-editor {\n box-sizing: border-box;\n width: 100%;\n}\n.perseus-json-editor {\n width: 100%;\n font-family: monospace;\n height: 500px;\n}\n.perseus-json-editor.invalid {\n background-color: #ffe6e6;\n}\n.perseus-textarea-pair {\n border: 1px solid #ddd;\n font-size: 12px;\n line-height: 1.6;\n position: relative;\n}\n.perseus-textarea-pair > .perseus-textarea-underlay {\n color: transparent;\n margin-bottom: 12px;\n padding: 10px;\n white-space: pre-wrap;\n word-wrap: break-word;\n}\n.perseus-textarea-pair > .perseus-textarea-underlay b {\n font-weight: normal;\n background-color: #dfd;\n}\n.perseus-textarea-pair > .perseus-textarea-underlay b.selected {\n background-color: #ddf;\n}\n.perseus-textarea-pair > .perseus-textarea-underlay b.error {\n background-color: #fcc;\n}\n.perseus-textarea-pair > textarea {\n background: transparent;\n border: 0;\n box-sizing: border-box;\n font: inherit;\n height: 100%;\n left: 0;\n overflow: hidden;\n padding: 10px;\n position: absolute;\n resize: none;\n top: 0;\n width: 100%;\n}\n.perseus-widget-row {\n margin: 7px 0;\n width: 100%;\n}\n.perseus-widget-row .perseus-widget-left-col,\n.perseus-widget-row .perseus-widget-right-col {\n display: inline-block;\n width: 50%;\n}\n.perseus-widget-row .perseus-widget-left-col .range-input,\n.perseus-widget-row .perseus-widget-right-col .range-input {\n float: right;\n margin-right: 5px;\n}\n.perseus-widget-row > .range-input {\n margin-left: 10px;\n}\n.perseus-answer-options {\n border: 1px solid #ddd;\n padding: 10px;\n}\n.perseus-answer-options * {\n margin-bottom: 4px;\n}\n.perseus-answer-widget {\n border: 1px solid #ddd;\n border-radius: 0 0 3px 3px;\n padding: 10px;\n}\n.perseus-answer-none {\n border-bottom: 1px solid #ddd;\n}\n.perseus-answer-none > div {\n display: none;\n}\n.perseus-widget-editor {\n border: 1px solid #ddd;\n border-radius: 3px;\n}\n.perseus-widget-editor:not(:first-child) {\n margin-top: 10px;\n}\n.perseus-widget-editor .perseus-widget-editor-title {\n background-color: #eee;\n font-size: 1.25em;\n padding: 4px 10px;\n border-radius: 3px 3px 0 0;\n border: 0;\n display: flex;\n align-items: center;\n position: relative;\n cursor: pointer;\n}\n.perseus-widget-editor .perseus-widget-editor-title.closed {\n border-radius: 3px;\n}\n.perseus-widget-editor .perseus-widget-editor-title :first-child {\n flex-grow: 1;\n}\n.perseus-widget-editor .perseus-widget-editor-title > a {\n color: inherit;\n text-decoration: none;\n}\n.perseus-widget-editor .perseus-widget-editor-title .alignment {\n margin-right: 5px;\n}\n.perseus-widget-editor .perseus-widget-editor-title .simple-button {\n font-size: 13px;\n padding: 0 10px;\n}\n.perseus-widget-editor .perseus-widget-editor-content {\n border-radius: 0 0 3px 3px;\n padding: 0 var(--wb-sizing-size_100) var(--wb-sizing-size_100);\n transition: all 0s;\n}\n.perseus-widget-editor .perseus-widget-editor-content.leave {\n display: none;\n}\n.perseus-widget-editor .perseus-widget-editor-content .inline-options {\n float: inline-start;\n /* flexbox and inline-block don't work on <legend> elements, so going old-school here */\n line-height: 24px;\n /* for alignment with items in same line (like pills or buttons) */\n padding-inline-end: 0.5em;\n}\n.perseus-widget-editor .perseus-widget-editor-content .tooltip-for-legend {\n display: inline-block;\n line-height: 24px;\n}\n.perseus-widget-editor .categorizer-container {\n overflow-x: scroll;\n}\n.perseus-widget-editor .section-accordion {\n display: flex;\n flex-direction: row;\n}\n.perseus-widget-editor .delete-item-button {\n align-self: center;\n padding-right: 0.5em;\n}\n.perseus-widget-editor-title-id {\n display: inline-flex;\n align-items: center;\n}\n.perseus-widget-editor-title-id > svg {\n float: left;\n font-size: 14px;\n margin-right: 10px;\n}\n.perseus-editor-accordion-container {\n display: inline-grid;\n width: 100%;\n}\n.perseus-editor-accordion-container.collapsed {\n grid-template-rows: 0fr;\n min-height: 0;\n visibility: hidden;\n transition:\n all 0.25s step-end,\n grid-template-rows 0.25s;\n}\n.perseus-editor-accordion-container.expanded {\n grid-template-rows: 1fr;\n min-height: 100%;\n visibility: visible;\n transition: grid-template-rows 0.5s;\n}\n.perseus-editor-accordion-container .perseus-editor-accordion-content {\n overflow: hidden;\n margin: 0 -1px;\n /* allows focus ring on accordion to show */\n padding: 0 1px;\n}\n.perseus-editor-widgets-selectors {\n background-color: #eee;\n border: 1px solid #ddd;\n border-top: 0;\n border-radius: 0 0 3px 3px;\n display: flex;\n flex-wrap: wrap;\n padding: 10px / 2;\n}\n.perseus-editor-widgets-selectors select {\n margin: 2px;\n}\n.perseus-editor-widgets > div.selected > strong {\n background-color: #ddf;\n}\n.perseus-editor-widgets .warning {\n background-color: #ffcccc;\n padding: 4px;\n margin: 4px;\n}\n.perseus-editor-word-count {\n cursor: help;\n flex: 1;\n float: right;\n margin-right: 3px;\n margin-top: 2px;\n text-align: right;\n}\n.MathJax .math {\n color: inherit;\n}\n#perseus {\n margin: 20px;\n z-index: 10;\n}\n#perseus #problemarea #workarea {\n margin: 0;\n}\n#perseus #problemarea #workarea .perseus-image-caption {\n top: 0px !important;\n}\n#perseus .add-choice-container {\n display: flex;\n flex-direction: row;\n margin-bottom: 20px;\n text-align: left;\n}\n#problemarea {\n font-size: 14px;\n position: relative;\n float: left;\n padding-bottom: 38px;\n}\n#problemarea a:link,\n#problemarea input,\n#problemarea label,\n#problemarea select {\n /* for dropdowns */\n position: relative;\n z-index: 3;\n /* interactive-content */\n}\n.perseus-editor-row {\n display: flex;\n flex-direction: row;\n margin-block-end: 32px;\n}\n.perseus-editor-left-cell {\n display: flex;\n flex-direction: column;\n vertical-align: top;\n width: 360px;\n max-width: 360px;\n min-width: 360px;\n position: relative;\n z-index: 10;\n /* Make the left cell scrollable. */\n overflow-y: auto;\n /* Don't show the the horizontal scrollbar that only appears when\n * the vertical scrollbar appears. */\n overflow-x: hidden;\n /* Keep the left cell scroll area within the viewport. (244px to account\n * for the header.) */\n max-height: calc(95vh - 244px);\n\n /* Border and gutter to make it more obvious how big the left cell is. */\n border: 1px solid var(--wb-semanticColor-core-border-neutral-default);\n margin-inline-end: 32px;\n}\n.perseus-editor-right-cell {\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n padding: 30px;\n padding-top: 5px;\n vertical-align: top;\n /* Make the right cell scrollable. */\n overflow-y: auto;\n /* Keep the left cell scroll area within the viewport. (244px to account\n * for the header.) */\n max-height: calc(95vh - 244px);\n /* Don't shrink below the preview's intrinsic width. We need this to\n * preserve the Tablet and Desktop preview widths. */\n flex-shrink: 0;\n /* Border to make it more obvious how big the left cell is. */\n border: 1px solid var(--wb-semanticColor-core-border-neutral-default);\n}\n.perseus-hint-editor .perseus-single-editor {\n margin-bottom: 5px;\n}\n.perseus-hint-editor .remove-hint {\n float: right;\n font-size: 13px;\n padding: 0 10px;\n}\n.perseus-hint-editor + div .perseus-hint-renderer {\n width: 100%;\n}\n.perseus-hint-editor + div .perseus-hint-renderer div.paragraph {\n margin: 0px 0px 22px 0px;\n}\n.perseus-hint-editor-actions {\n margin: 8px;\n margin-block-start: 0;\n}\n.perseus-article-editor {\n margin-bottom: 20px;\n margin-top: 20px;\n}\n.perseus-article-editor .section-control-button,\n.perseus-article-editor .step-control-button {\n font-size: 13px;\n padding: 2px 10px;\n margin: 0 2px;\n}\n.perseus-article-editor .perseus-editor-left-cell {\n min-width: 360px;\n}\n/* Pin the issues panel and section title to the top of the section's scroll\n * area so they stay visible while the author scrolls through that section's\n * content. */\n.perseus-article-editor\n .perseus-editor-left-cell\n > .perseus-editor-sticky-header {\n position: sticky;\n inset-block-start: 0;\n /* Draw above the section content that scrolls underneath it. */\n z-index: 1;\n /* Make the sticky element background opaque so text doesn't overlap\n * while scrolling. */\n background-color: var(--wb-semanticColor-core-background-base-default);\n /* A flex item won't shrink below its content by default, but it also\n * shouldn't stretch to fill the cell when the section is short. */\n flex-shrink: 0;\n}\n/* An expanded panel with many issues could otherwise cover the whole scroll\n * area, leaving nothing to scroll. Cap it and let the list scroll instead. */\n.perseus-article-editor\n .perseus-editor-sticky-header\n .perseus-widget-editor-panel {\n max-height: 40vh;\n overflow-y: auto;\n}\n.perseus-article-editor .mobile-preview,\n.perseus-article-editor .desktop-preview,\n.perseus-article-editor .editor-preview,\n.perseus-article-editor .standalone-preview {\n box-sizing: border-box;\n}\n.perseus-article-editor .mobile-preview {\n border: 1px solid rgba(0, 0, 0, 0.29);\n max-width: 322px;\n box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.29);\n padding: 32px 16px;\n}\n.perseus-article-editor .desktop-preview {\n border: 1px solid transparent;\n padding: 32px 20px;\n}\n.perseus-article-editor .editor-preview {\n border: 1px solid var(--wb-semanticColor-core-border-neutral-default);\n}\n.perseus-article-editor .editor-preview {\n /* Make the preview scrollable. */\n overflow-y: auto;\n /* Keep the left cell scroll area within the viewport. (244px to account\n * for the header.) */\n max-height: calc(95vh - 244px);\n /* Don't shrink below the preview's intrinsic width. We need this to\n * preserve the Tablet and Desktop preview widths. */\n flex-shrink: 0;\n}\n.perseus-article-editor .editor-preview.full-width {\n width: 100%;\n}\n.perseus-article-editor .editor-preview .desktop-preview {\n border: 1px solid rgba(0, 0, 0, 0.29);\n box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.29);\n width: 100%;\n}\n.perseus-article-editor .standalone-preview .mobile-preview,\n.perseus-article-editor .standalone-preview .desktop-preview {\n margin-left: auto;\n margin-right: auto;\n}\n.perseus-article-editor .json-editor {\n margin: auto;\n max-width: 688px;\n}\n.perseus-article-editor .perseus-json-editor {\n display: block;\n margin-left: auto;\n margin-right: auto;\n}\n.perseus-article-editor .json-editor-warning {\n margin-bottom: 10px;\n text-align: center;\n}\n.perseus-article-editor .framework-perseus.perseus-article {\n box-sizing: border-box;\n}\n.perseus-article-editor .framework-perseus.perseus-article * {\n box-sizing: inherit;\n}\n.perseus-article-editor .perseus-editor-sticky-header > .pod-title {\n padding: 4px 9px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n.perseus-widget-dropdown input[type=\"text\"] {\n border: 1px solid #ccc;\n border-radius: 5px;\n padding: 5px;\n}\n\n.perseus-widget-dropdown .dropdown-choices {\n margin: 20px 0;\n}\n.perseus-widget-dropdown .dropdown-choices .dropdown-choice {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 10px;\n margin-bottom: 10px;\n}\n\n.perseus-widget-dropdown .dropdown-info {\n display: inline-flex;\n margin-bottom: 16px;\n}\n.perseus-widget-dropdown .dropdown-field {\n display: flex;\n flex-direction: row;\n align-items: center;\n min-width: 0;\n margin-bottom: 16px;\n}\n.perseus-widget-dropdown .remove-choice {\n margin-bottom: 10px;\n}\n.perseus-input-number-editor {\n font-family: Lato, \"Noto Sans\", sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 20px;\n}\n.perseus-input-number-editor .answer-option .unsimplified-options {\n min-height: 48px;\n}\n.perseus-input-number-editor .perseus-textarea-pair {\n font-size: 16px;\n}\n.perseus-input-number-editor .perseus-textarea-pair .perseus-textarea-underlay {\n margin-bottom: 26px;\n}\n.perseus-input-number-editor .perseus-textarea-pair textarea {\n background-color: #ffffff;\n border: 1px solid rgba(33, 36, 44, 0.5);\n border-radius: 4px;\n}\n.perseus-input-number-editor .input-answer-editor-value,\n.perseus-input-number-editor .input-answer-editor-message {\n display: inline-block;\n}\n.perseus-input-number-editor .input-answer-editor-value-container {\n display: block;\n}\n.perseus-input-number-editor .input-answer-editor-value-container input {\n background: #ffffff;\n border: 1px solid rgba(33, 36, 44, 0.5);\n border-radius: 4px;\n color: #21242c;\n font-family: Lato, \"Noto Sans\", sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 20px;\n outline-offset: -2px;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container\n .numeric-input-value {\n margin-left: 8px;\n width: 6em;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container\n .max-error-input-value {\n display: none;\n width: 3em;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container\n .max-error-plusmn {\n cursor: default;\n display: none;\n height: 32px;\n padding-top: 4px;\n text-align: center;\n vertical-align: top;\n width: 1em;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container.with-max-error\n .numeric-input-value,\n.perseus-input-number-editor\n .input-answer-editor-value-container:focus-within\n .numeric-input-value {\n border-right: none;\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container.with-max-error\n .max-error-input-value,\n.perseus-input-number-editor\n .input-answer-editor-value-container:focus-within\n .max-error-input-value {\n border-left: none;\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n display: inline-block;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container.with-max-error\n .max-error-plusmn,\n.perseus-input-number-editor\n .input-answer-editor-value-container:focus-within\n .max-error-plusmn {\n border-top: 1px solid rgba(33, 36, 44, 0.5);\n border-bottom: 1px solid rgba(33, 36, 44, 0.5);\n display: inline-block;\n}\n.perseus-input-number-editor .options-toggle,\n.perseus-input-number-editor .answer-trash,\n.perseus-input-number-editor .answer-status {\n height: 26px;\n line-height: 26px;\n outline-offset: -3px;\n vertical-align: middle;\n}\n.perseus-input-number-editor .value-divider {\n border-top: 1px solid #ccc;\n}\n.perseus-input-number-editor .options-toggle,\n.perseus-input-number-editor .answer-trash {\n border-left: 1px solid #ccc;\n box-sizing: border-box;\n cursor: pointer;\n display: inline-block;\n text-align: center;\n text-decoration: none;\n width: 20%;\n}\n.perseus-input-number-editor .options-toggle {\n background-color: #eee;\n color: #444;\n}\n.perseus-input-number-editor .options-toggle:hover {\n background-color: #ccc;\n}\n.perseus-input-number-editor .answer-trash {\n background-color: #c04f03;\n background-image: linear-gradient(to bottom, #e35d04, #c04f03);\n color: #fff;\n}\n.perseus-input-number-editor .answer-trash:hover {\n color: #fff;\n background-image: linear-gradient(to bottom, #f46e15, #d16014);\n}\n.perseus-input-number-editor .is-strict-indicator {\n background-color: #d9edf7;\n border-bottom: 1px solid #ccc;\n border-right: 1px solid #ccc;\n cursor: default;\n font-size: 16px;\n line-height: 12px;\n height: 12px;\n width: 12px;\n text-align: center;\n position: absolute;\n top: 0;\n right: auto;\n bottom: auto;\n left: 0;\n -webkit-user-select: none;\n user-select: none;\n}\n.perseus-input-number-editor .simplify-indicator {\n border-top: 1px solid #ccc;\n border-right: 1px solid #ccc;\n cursor: default;\n font-size: 10px;\n line-height: 13px;\n height: 13px;\n width: 12px;\n text-align: center;\n position: absolute;\n top: 12px;\n right: auto;\n bottom: auto;\n left: 0;\n -webkit-user-select: none;\n user-select: none;\n}\n.perseus-input-number-editor .simplify-indicator.optional {\n background-color: #aaffaa;\n}\n.perseus-input-number-editor .simplify-indicator.enforced {\n background-color: #ffcccc;\n}\n.perseus-input-number-editor .answer-status {\n color: inherit;\n display: inline-block;\n text-align: center;\n text-decoration: none;\n width: 60%;\n -webkit-user-select: none;\n user-select: none;\n}\n.perseus-input-number-editor .answer-status.wrong {\n background-color: #ffcccc;\n}\n.perseus-input-number-editor .answer-status.correct {\n background-color: #aaffaa;\n}\n.perseus-input-number-editor .answer-status.ungraded {\n background-color: #d9edf7;\n}\n.perseus-input-number-editor .input-answer-editor-message {\n margin-left: 5px;\n}\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor {\n font-family: \"Lucida Grande\";\n width: 230px;\n}\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor\n .perseus-textarea-pair\n > textarea,\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor\n .perseus-textarea-underlay {\n padding: 5px;\n}\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor\n .perseus-textarea-pair {\n border-color: #ccc;\n border-radius: 3px;\n min-height: 53px;\n}\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor\n .perseus-textarea-underlay {\n margin-bottom: 0;\n}\n.perseus-widget-radio {\n margin-bottom: 10px;\n}\n.perseus-widget-radio .choice-editor .perseus-single-editor {\n margin-bottom: 0;\n}\n.perseus-widget-radio .choice-editor.correct textarea {\n background: #aaffaa;\n}\n.perseus-widget-radio .choice-editor.incorrect textarea {\n background: #ffcccc;\n}\n.perseus-widget-radio textarea::placeholder {\n color: #777;\n}\n.perseus-widget-radio .rationale-editor .perseus-textarea-pair {\n border-top: 0;\n}\n.perseus-widget-radio .choice-rationale-editors,\n.perseus-widget-radio .choice-editor,\n.perseus-widget-radio .rationale-editor {\n display: inline-block;\n width: 100%;\n}\n.perseus-widget-radio .perseus-single-editor {\n border: 0;\n display: inline-block;\n margin: 0 0 5px;\n vertical-align: top;\n}\n.perseus-widget-radio .perseus-single-editor p {\n margin: 0;\n}\n.perseus-widget-radio .perseus-textarea-pair,\n.perseus-widget-radio .perseus-textarea-underlay {\n /* Wrap when text area has a long image link that overflows. */\n overflow-wrap: anywhere;\n display: block;\n}\n.perseus-widget-radio .perseus-textarea-pair > textarea,\n.perseus-widget-radio .perseus-textarea-pair > .perseus-textarea-underlay {\n padding: 5px;\n}\n.perseus-widget-editor-content .add-choice-container .simple-button {\n margin-right: 10px;\n}\n.perseus-widget-editor-content .perseus-widget-radio {\n position: static;\n}\n.perseus-widget-editor-content .perseus-widget-radio .checkbox {\n position: relative;\n top: -10px;\n}\n.perseus-widget-editor-content .perseus-radio-option.none-of-above:before {\n content: \"None of the above\";\n display: block;\n font-style: italic;\n font-weight: bold;\n}\n.perseus-widget-editor-content\n .perseus-radio-option.none-of-above\n .choice-editor.incorrect {\n opacity: 0.5;\n}\n#solutionarea .perseus-widget-radio li {\n padding: 7px 0;\n}\n.framework-perseus\n table.perseus-widget-table-of-values\n th\n .perseus-single-editor {\n width: 80px;\n margin-bottom: 6px;\n}\n.framework-perseus\n table.perseus-widget-table-of-values\n th\n .perseus-textarea-pair,\n.framework-perseus\n table.perseus-widget-table-of-values\n th\n .perseus-single-editor {\n height: 50px;\n}\n.categorization-container.categorization-container-editor {\n width: 350px;\n margin-bottom: 160px;\n}\n.categorization-container.categorization-container-editor .card input {\n margin: 7px 3px 7px 13px;\n font-size: 12px;\n display: block;\n width: 81%;\n}\n.categorization-container.categorization-container-editor .category {\n float: left;\n padding: 5px;\n width: 160px;\n}\n.categorization-container.categorization-container-editor .categories {\n width: 176px;\n}\n.categorization-container.categorization-container-editor\n .perseus-textarea-underlay {\n margin-bottom: 0;\n}\n.categorization-container.categorization-container-editor .drag-bar {\n float: left;\n font-size: 10px;\n padding: 2px 0;\n height: 70%;\n margin-top: 3px;\n}\n.categorization-container.categorization-container-editor .header {\n margin-bottom: 8px;\n}\n.categorization-container.categorization-container-editor .header input {\n display: block;\n margin-right: 24px;\n width: 76%;\n}\n.categorization-container.categorization-container-editor .header .remove {\n position: relative;\n top: -14px;\n left: 12px;\n float: right;\n width: 20px;\n height: 20px;\n padding: 2px;\n color: #666;\n cursor: pointer;\n}\n.categorization-container.categorization-container-editor\n .header\n .remove:hover {\n color: #333;\n}\n.categorization-container.categorization-container-editor .delete-item-area {\n position: absolute;\n width: 150px;\n height: 60px;\n padding-top: 40px;\n bottom: -150px;\n left: 10px;\n border: dashed 2px #888;\n color: #888;\n text-align: center;\n font-size: 20px;\n}\n.categorization-container.categorization-container-editor\n .delete-item-area.target {\n border-color: black;\n color: #333;\n}\n.categorization-container.categorization-container-editor .card {\n width: 130px;\n padding: 0;\n}\n.categorization-container.categorization-container-editor\n .card.dragging\n .drag-bar {\n margin-left: 2px;\n}\n.categorization-editor-area {\n height: 30px;\n}\n.categorization-editor-area .add-item {\n float: left;\n margin-left: 17px;\n}\n.categorization-editor-area .add-category {\n margin-left: 173px;\n}\n.perseus-widget-interactive-graph {\n display: block;\n}\n.perseus-widget-plotter-editor .plotter-categories,\n.perseus-widget-plotter-editor .pic-url {\n width: 70%;\n}\n.perseus-text-list-editor input[type=\"text\"] {\n padding: 3px;\n margin-right: 5px;\n min-width: 20px;\n max-width: 340px;\n}\n.perseus-text-list-editor.layout-horizontal input[type=\"text\"] {\n float: left;\n}\n.perseus-matcher-editor .perseus-text-list-editor {\n float: left;\n max-width: 50%;\n}\n.perseus-matcher-editor .perseus-text-list-editor input[type=\"text\"] {\n max-width: 90%;\n}\n.perseus-matcher-editor input[type=\"text\"] {\n width: 46%;\n}\n.perseus-matcher-editor input[type=\"text\"] + input[type=\"text\"] {\n margin-left: 2%;\n}\n.info-tip {\n display: inline-block;\n}\n.info-tip-content-container p {\n font-size: 12px;\n line-height: 1.4;\n margin: 0;\n}\n.info-tip-content-container p + p {\n margin-top: 22px;\n}\n.perseus-widget-interaction-editor\n .perseus-widget-interaction-editor-select-element {\n background-color: #eee;\n border: 1px solid #ddd;\n border-top: 0;\n border-radius: 0 0 3px 3px;\n padding: 5px 10px;\n margin: 20px -11px -11px -11px;\n}\n.perseus-widget-interaction-editor .colorpicker-circle {\n border-radius: 50%;\n width: 14px;\n height: 14px;\n position: absolute;\n left: 5px;\n top: 5px;\n}\n.perseus-interaction-element {\n border: 1px solid #ddd;\n border-radius: 3px;\n}\n.perseus-interaction-element .perseus-interaction-element-title {\n background-color: #eee;\n border: 1px solid #ddd;\n border-bottom: 0;\n font-size: 1.25em;\n padding: 4px 10px;\n border-radius: 3px 3px 0 0;\n border: 0;\n color: inherit;\n display: block;\n text-decoration: none;\n white-space: nowrap;\n font-size: 1em;\n overflow: hidden;\n}\n.perseus-interaction-element .perseus-interaction-element-title.closed {\n border-radius: 3px;\n}\n.perseus-interaction-element .perseus-interaction-element-title > svg {\n float: left;\n font-size: 14px;\n margin-right: 10px;\n}\n.perseus-interaction-element .perseus-interaction-element-content {\n border-radius: 0 0 3px 3px;\n border-top: 1px solid #ddd;\n padding: 10px;\n}\n.perseus-interaction-element\n .perseus-interaction-element-content\n .edit-controls {\n text-align: right;\n margin-top: -30px;\n}\n.perseus-interaction-element\n .perseus-interaction-element-content\n .edit-controls\n > button {\n background: #fff;\n border: 0;\n cursor: pointer;\n padding: 0;\n margin-left: 7px;\n font-size: 18px;\n color: #555;\n}\n.perseus-interaction-element .perseus-interaction-element-content.leave {\n display: none;\n}\n.button-set-separator {\n margin: 10px 0;\n}\n.perseus-widget-editor .unit-radio {\n color: black;\n text-decoration: none;\n}\n.unit-example-not-okay {\n color: red;\n}\n.unit-example-okay {\n color: green;\n}\n.pair-editor input {\n width: 120px;\n}\n.marvel-device.iphone6.silver:after {\n z-index: 1;\n}\n.perseus-diff {\n margin: 0 10px;\n}\n.perseus-diff .diff-header {\n font-size: 18px;\n padding: 10px 0;\n width: 50%;\n display: inline-block;\n}\n.perseus-diff .diff-header.collapsed {\n font-size: 14px;\n padding: 0px;\n}\n.perseus-diff .diff-body {\n border-top: 1px solid #e4e4e4;\n border-bottom: 1px solid #e4e4e4;\n}\n.perseus-diff .diff-row {\n width: 50%;\n white-space: pre-wrap;\n box-sizing: border-box;\n font-size: 14px;\n padding-right: 20px;\n padding-left: 10px;\n overflow: hidden;\n}\n.perseus-diff .diff-row.collapsed {\n color: #888;\n cursor: pointer;\n}\n.perseus-diff .diff-row.collapsed:hover {\n color: #666;\n}\n.perseus-diff .diff-row.collapsed:active {\n color: #444;\n}\n.perseus-diff .diff-row .diff-line {\n margin-bottom: 20px;\n}\n.perseus-diff .before {\n float: left;\n border-left: 1px solid #e4e4e4;\n}\n.perseus-diff .after {\n float: right;\n border-right: 1px solid #e4e4e4;\n border-left: 1px solid #e4e4e4;\n}\n.perseus-diff .inner-value {\n height: 100%;\n padding: 3px;\n}\n.perseus-diff .not-present {\n display: none;\n}\n.perseus-diff .blank-space {\n visibility: hidden;\n}\n.perseus-diff .added {\n background-color: #eeffee;\n}\n.perseus-diff .added.dark {\n background-color: #aaffaa;\n}\n.perseus-diff .removed {\n background-color: #ffeeee;\n}\n.perseus-diff .removed.dark {\n background-color: #ffaaaa;\n}\n.perseus-diff .image {\n display: inline-block;\n margin-left: 20px;\n margin-bottom: 10px;\n}\n.perseus-diff .image,\n.perseus-diff .image > div,\n.perseus-diff .image > img {\n max-height: 300px;\n max-width: 100%;\n}\n.perseus-diff .image-unchanged {\n border: 1px solid #aaaaaa;\n}\n.perseus-diff .image-added {\n border: 2px solid #aaffaa;\n}\n.perseus-diff .image-removed {\n border: 2px solid #ffaaaa;\n}\n.perseus-diff .diff-separator {\n border-bottom: 1px dashed #444;\n margin: 30px 0 10px 0;\n}\n/* Reset fieldset min-width as our editors include a fieldset element\nnested within a table cell, which results in native browser styling that\nbreaks the layout depending on the widget editors used.*/\n/* TODO(benchristel): this is the only usage of .perseus-editor-table. Use a\n * different selector here, then remove the perseus-editor-table class.\n */\n.perseus-editor-table fieldset {\n min-inline-size: 0;\n min-width: 0;\n}\n/**\n * Disabled Editing Mode Styles\n *\n * Applied when editingDisabled=true to prevent content creators from making\n * changes while still allowing them to view the editor interface.\n *\n * Targets all form controls and interactive elements within disabled editors.\n */\n.perseus-single-editor.perseus-editor-disabled input,\n.perseus-single-editor.perseus-editor-disabled select,\n.perseus-single-editor.perseus-editor-disabled .perseus-math-input,\n.perseus-single-editor.perseus-editor-disabled .keypad-input {\n background-color: var(\n --wb-semanticColor-input-disabled-background\n ) !important;\n cursor: not-allowed !important;\n border-color: var(--wb-semanticColor-input-disabled-border) !important;\n}\n\n/* The markdown field renders widget-reference highlights in a transparent\n underlay that sits behind the textarea, so tint the container — not the\n textarea — to keep the highlights visible while still reading as disabled. */\n.perseus-single-editor.perseus-editor-disabled .perseus-textarea-pair {\n background-color: var(\n --wb-semanticColor-input-disabled-background\n ) !important;\n border-color: var(--wb-semanticColor-input-disabled-border) !important;\n cursor: not-allowed !important;\n}\n\n/* Plotter is a special case due to the archaic graphie implementation. */\n.perseus-editor-disabled .perseus-widget-plotter {\n pointer-events: none;\n}\n",".padded-x {\n padding-left: var(--wb-sizing-size_080);\n padding-right: var(--wb-sizing-size_080);\n}\n\n.padded-y {\n padding-top: var(--wb-sizing-size_060);\n padding-bottom: var(--wb-sizing-size_060);\n}\n\n.answer-option {\n border: 1px solid #ddd;\n border-radius: 3px;\n display: flex;\n flex-direction: column;\n}\n\n.button-row {\n display: flex;\n gap: var(--wb-sizing-size_120);\n}\n\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.button-sets {\n text-transform: uppercase !important;\n}\n\n.answers-subtitle {\n font-style: italic !important;\n}\n\n.answers-group {\n gap: var(--wb-sizing-size_120) !important;\n}\n\n.answers-list {\n gap: var(--wb-sizing-size_080) !important;\n}\n\n.delete-button {\n padding-inline: var(--wb-sizing-size_160) !important;\n}\n",".title {\n font-size: 18px;\n font-weight: bold;\n}\n\n.input {\n font-size: 18px;\n}\n\n.hints-title {\n margin-top: var(--wb-sizing-size_100);\n font-size: 110%;\n font-weight: bold;\n}\n",".dimensions-container {\n display: flex;\n flex-direction: column;\n align-items: start;\n background-color: var(\n --wb-semanticColor-core-background-instructive-subtle\n );\n border: 1px solid var(--wb-semanticColor-core-border-base-subtle);\n border-radius: var(--wb-sizing-size_080);\n margin-block-start: var(--wb-sizing-size_080);\n margin-block-end: var(--wb-sizing-size_120);\n padding: var(--wb-sizing-size_080);\n}\n\n.dimensions-field-container {\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n\n.x-span {\n display: block;\n margin-inline: var(--wb-sizing-size_080);\n}\n\n.horizontal-line {\n width: 100%;\n height: 1px;\n background-color: var(--wb-semanticColor-core-background-neutral-default);\n margin-block: var(--wb-sizing-size_080);\n}\n\n.alt-text-field-container {\n /* Relative position so that the character counter child element\n can be positioned absolutely. */\n position: relative;\n /* Padding to make space for the character counter. */\n padding-bottom: var(--wb-sizing-size_120);\n}\n",".dark-mode-toggle-container {\n display: flex;\n flex-direction: column;\n gap: 0.8rem;\n margin-block-end: 0.8rem;\n}\n.dark-mode-suppression-container {\n display: flex;\n flex-direction: row;\n gap: 0.4rem;\n align-items: center;\n}\n",".decorative-toggle-container {\n margin-block-end: var(--wb-sizing-size_080);\n}\n\n.flex-row {\n display: flex;\n align-items: center;\n gap: var(--wb-sizing-size_040);\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n\n/* inline-flex so the (single-select) group flows inline with adjacent\n * labels/badges (e.g. the \"Status\" label) instead of wrapping onto its own\n * line. It stays cohesive — its segments never split across lines; the whole\n * group wraps below the label as a unit if there isn't room. */\n.group {\n display: inline-flex !important;\n flex-direction: row !important;\n align-items: center !important;\n vertical-align: middle !important;\n gap: var(--wb-sizing-size_080) !important;\n}\n\n/* Multi-select group: wraps onto multiple rows as an aligned grid with\n * consistent row + column gaps. Stretch to the full available width so it only\n * wraps when the segments genuinely don't fit on one line (not because a flex\n * parent shrank it to content width). */\n.wrap-group {\n display: flex !important;\n flex-direction: row !important;\n flex-wrap: wrap !important;\n align-items: center !important;\n align-self: stretch !important;\n gap: var(--wb-sizing-size_080) !important;\n}\n\n/* The segment IS the Clickable's <button>. Clickable already inherits the font,\n * resets the text decoration, and sets the cursor (pointer / not-allowed when\n * disabled); here we add the visual box. Its variants are driven by selectors\n * below — selected via `[aria-checked=\"true\"]`, disabled via `[aria-disabled]`,\n * hover via `:hover` — so the markup needs only this one static class. The\n * keyboard focus ring is a rounded box-shadow (follows the border radius, unlike\n * `outline`) shown only on `:focus-visible` so it doesn't appear after a click. */\n.segment {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n justify-content: center !important;\n padding-block: var(--wb-sizing-size_040) !important;\n padding-inline: var(--wb-sizing-size_120) !important;\n border-radius: var(--wb-border-radius-radius_040) !important;\n border: var(--wb-border-width-thin) solid\n var(--wb-semanticColor-core-border-neutral-subtle) !important;\n background-color: var(\n --wb-semanticColor-core-background-base-default\n ) !important;\n color: var(--wb-semanticColor-core-foreground-neutral-strong) !important;\n font-size: var(--wb-font-body-size-small) !important;\n line-height: var(--wb-font-body-lineHeight-small) !important;\n white-space: nowrap !important;\n}\n\n.segment:focus-visible {\n outline: none !important;\n box-shadow: 0 0 0 var(--wb-border-width-medium)\n var(--wb-semanticColor-focus-outer) !important;\n}\n\n/* Hover only when interactive and not already selected. */\n.segment:not([aria-disabled=\"true\"]):not([aria-checked=\"true\"]):hover {\n border-color: var(\n --wb-semanticColor-core-border-neutral-default\n ) !important;\n background-color: var(\n --wb-semanticColor-core-background-neutral-subtle\n ) !important;\n}\n\n.segment[aria-checked=\"true\"] {\n background-color: var(\n --wb-semanticColor-core-background-instructive-default\n ) !important;\n border-color: var(\n --wb-semanticColor-core-background-instructive-default\n ) !important;\n color: var(--wb-semanticColor-core-foreground-knockout-default) !important;\n}\n\n.segment[aria-disabled=\"true\"] {\n background-color: var(\n --wb-semanticColor-core-background-disabled-subtle\n ) !important;\n border-color: var(\n --wb-semanticColor-core-border-disabled-default\n ) !important;\n color: var(--wb-semanticColor-core-foreground-disabled-default) !important;\n}\n\n.segment[aria-disabled=\"true\"][aria-checked=\"true\"] {\n background-color: var(\n --wb-semanticColor-core-background-disabled-strong\n ) !important;\n border-color: var(\n --wb-semanticColor-core-background-disabled-strong\n ) !important;\n color: var(--wb-semanticColor-core-foreground-disabled-strong) !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n\n.field {\n margin-block: var(--wb-sizing-size_120) !important;\n gap: var(--wb-sizing-size_080) !important;\n align-items: flex-start !important;\n}\n\n/* Label + InfoTip on one line. */\n.label-row {\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_040) !important;\n}\n\n/* A label whose control sits inline beside it (e.g. \"User input\"). */\n.inline-field {\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_080) !important;\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.single-select-short {\n /* Non-standard spacing, but it's the smallest we can go\n without running into styling issues with the dropdown. */\n height: 26px !important;\n}\n\n.row {\n display: flex !important;\n flex-direction: row !important;\n margin-top: 8px !important;\n align-items: center !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.container {\n /* gap is for the vertical spacing between the captions and fields,\n * while padding-top restores the space above the first caption\n * this replaces the deprecated Strut spacing style */\n gap: var(--wb-sizing-size_120) !important;\n padding-top: var(--wb-sizing-size_060) !important;\n}\n\n.caption {\n color: var(--wb-semanticColor-core-foreground-neutral-subtle) !important;\n}\n",".background-url-input {\n border: 1px solid var(--wb-semanticColor-core-border-neutral-subtle);\n border-radius: var(--wb-sizing-size_040);\n padding: var(--wb-sizing-size_040);\n}\n\n/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.checkbox-row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n justify-content: space-between !important;\n margin-bottom: var(--wb-sizing-size_080) !important;\n}\n\n.protractor-section {\n margin-top: var(--wb-sizing-size_080) !important;\n padding-top: var(--wb-sizing-size_080) !important;\n padding-bottom: var(--wb-sizing-size_080) !important;\n border-top: 1px solid var(--wb-semanticColor-core-border-neutral-subtle) !important;\n border-bottom: 1px solid var(--wb-semanticColor-core-border-neutral-subtle) !important;\n}\n",".tree-list {\n list-style: revert;\n margin-left: var(--wb-sizing-size_080);\n}\n\n.indent-list {\n list-style: revert;\n margin-left: var(--wb-sizing-size_120);\n}\n\n/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.switch-row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_080) !important;\n margin-top: var(--wb-sizing-size_080) !important;\n margin-bottom: var(--wb-sizing-size_080) !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.switch-row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_080) !important;\n margin-top: var(--wb-sizing-size_120) !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.container {\n margin-top: var(--wb-sizing-size_080) !important;\n}\n\n.add-element-select {\n background-color: var(\n --wb-semanticColor-core-background-instructive-subtle\n ) !important;\n border-radius: var(--wb-sizing-size_040) !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.container {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_160) !important;\n}\n\n.label {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_060) !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_060) !important;\n /* Set minWidth to \"auto\" to prevent the component from bleeding */\n /* into the margins. (minWidth is 0 by default.) */\n min-width: auto !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.line-weight-select {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_040) !important;\n /* Allow truncation, stop bleeding over the edge. */\n min-width: 0 !important;\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n}\n\n/* gap replaces the spacer that separated the header label from its swatch. */\n.header {\n gap: var(--wb-sizing-size_080) !important;\n}\n\n.space-under {\n margin-bottom: var(--wb-sizing-size_080) !important;\n}\n\n.color-row {\n margin-top: var(--wb-sizing-size_080) !important;\n margin-bottom: var(--wb-sizing-size_080) !important;\n /* gap replaces the spacer between the color select and the fill control. */\n gap: var(--wb-sizing-size_160) !important;\n}\n\n/* gap replaces the spacer between the \"fill\" label and its select. */\n.fill-label {\n gap: var(--wb-sizing-size_060) !important;\n}\n\n.truncated-width {\n /* Allow truncation, stop bleeding over the edge. */\n min-width: 0 !important;\n}\n\n.add-button {\n align-self: start !important;\n}\n\n.horizontal-rule {\n height: 1px !important;\n background-color: var(\n --wb-semanticColor-core-border-neutral-subtle\n ) !important;\n}\n\n/* Top spacing for a section start (a divider opening a section, or a heading). */\n.section-top {\n margin-top: var(--wb-sizing-size_120) !important;\n}\n\n/* A divider that hugs the content directly above it. */\n.divider-tight {\n margin-top: var(--wb-sizing-size_040) !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.container {\n display: flex !important;\n flex-direction: column !important;\n gap: var(--wb-sizing-size_060) !important;\n padding-top: var(--wb-sizing-size_080) !important;\n}\n\n.row {\n flex-direction: row !important;\n align-items: center !important;\n}\n\n.button {\n align-self: start !important;\n margin-top: calc(-1 * var(--wb-sizing-size_060)) !important;\n}\n\n.caption {\n color: var(--wb-semanticColor-core-foreground-neutral-subtle) !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.container {\n width: 100% !important;\n flex-direction: row !important;\n align-items: center !important;\n margin-top: var(--wb-sizing-size_040) !important;\n}\n\n.delete-button {\n /* Line up the delete icon with the rest of the content. */\n margin-inline-start: calc(-1 * var(--wb-sizing-size_040)) !important;\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.accordion-header-container {\n /* Stop the label summary from wrapping. */\n white-space: nowrap !important;\n}\n\n.accordion-header {\n padding: var(--wb-sizing-size_040) !important;\n margin-inline-end: var(--wb-sizing-size_080) !important;\n border-radius: var(--wb-sizing-size_040) !important;\n text-overflow: ellipsis !important;\n overflow: hidden !important;\n background-color: var(\n --wb-semanticColor-core-background-base-default\n ) !important;\n}\n\n.row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n /* Allow truncation, stop bleeding over the edge. */\n min-width: 0 !important;\n}\n\n/* gap replaces the spacer that separated the header label from its swatch. */\n.header {\n gap: var(--wb-sizing-size_080) !important;\n}\n\n/* The \"text\" label row: grow to fill, with a gap before the text field. */\n.text-label {\n margin-bottom: var(--wb-sizing-size_080) !important;\n flex-grow: 1 !important;\n gap: var(--wb-sizing-size_080) !important;\n}\n\n/* gap between the color select and the size control. */\n.color-row {\n gap: var(--wb-sizing-size_160) !important;\n}\n\n/* gap replaces the spacer between the \"size\" label and its select. */\n.size-label {\n gap: var(--wb-sizing-size_080) !important;\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n\n.accordion-header {\n text-overflow: ellipsis !important;\n /* A maximum width needs to be specified in order for the ellipsis to work. */\n /* The 64px in the calculation accounts for the line swatch (56px) and the preceding strut (8px). */\n /* Margin and padding won't work here because they would create space between the header text and the swatch. */\n max-width: calc(100% - 64px) !important;\n overflow: hidden !important;\n white-space: nowrap !important;\n}\n\n.axis-menu {\n min-width: auto !important;\n}\n\n.copy-paste-button {\n flex-shrink: 0 !important;\n margin: 0 2px !important;\n}\n\n.domain-min {\n justify-content: space-between !important;\n /* The 'width' property is applied to the label, which wraps the text and the input field. */\n /* The width of the input fields (min/max) should be the same (to have a consistent look), */\n /* so the following calculation distributes the space accordingly. */\n /* For the \"domain/range min\" block, the text is 82.7px, and the strut is 6px (88.7px total). */\n /* The \"domain/range max\" block is 30.23px, and the strut is 6px (36.23px total). */\n /* The calculation takes the remain space after the text & struts (141px total) are removed, */\n /* and divides it between the two input fields equally. */\n /* The calculation reads: \"Take 1/2 of the non-text space, and add the required space for this label's text\" */\n width: calc(((100% - 141px) / 2) + 88.7px) !important;\n text-wrap: nowrap !important;\n}\n\n.domain-max {\n /* See explanation for \"domainMin\" for the calculation below. */\n width: calc(((100% - 141px) / 2) + 36.2px) !important;\n}\n\n.dropdown-label {\n align-items: center !important;\n display: flex !important;\n /* gap replaces the spacer between the label text and its control. */\n gap: var(--wb-sizing-size_060) !important;\n}\n\n/* Plain <ul> element, no !important needed. */\n.example-container {\n background: white;\n border: 1px solid var(--wb-semanticColor-core-border-neutral-subtle);\n border-radius: 4px;\n flex-grow: 1;\n list-style-type: none;\n /* Nothing special about the maxHeight value, */\n /* just a good height to partially show a 3rd example in the list */\n /* to hint at scrollable content. */\n max-height: 88px;\n margin: 8px 0 0 0;\n overflow-y: scroll;\n padding: 4px 12px 4px 4px;\n}\n\n.example-content {\n font-family: \"Lato\", sans-serif !important;\n flex-grow: 1 !important;\n color: var(--wb-semanticColor-core-foreground-neutral-strong) !important;\n}\n\n/* Plain <li> element, no !important needed. */\n.example-row {\n align-items: center;\n display: flex;\n flex-direction: row;\n min-height: 44px;\n}\n\n.row-space {\n margin-top: var(--wb-sizing-size_080) !important;\n}\n\n.row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n}\n\n/* gap replaces the spacer that separated the header label from its swatch. */\n.header {\n gap: var(--wb-sizing-size_080) !important;\n}\n\n/* Color/stroke row: gap between controls, with spacing below the row. */\n.color-row {\n margin-bottom: var(--wb-sizing-size_080) !important;\n gap: var(--wb-sizing-size_120) !important;\n}\n\n/* gap between the directional-axis dropdown and the equation field. */\n.axis-row {\n gap: var(--wb-sizing-size_080) !important;\n}\n\n/* gap between the domain min and max controls. */\n.domain-row {\n gap: var(--wb-sizing-size_160) !important;\n}\n\n/* Label settings styles */\n.add-button {\n align-self: start !important;\n}\n\n.horizontal-rule {\n height: 1px !important;\n background-color: var(\n --wb-semanticColor-core-border-neutral-subtle\n ) !important;\n}\n\n/* Top spacing for a section start (a divider opening a section, or a heading). */\n.section-top {\n margin-top: var(--wb-sizing-size_120) !important;\n}\n\n/* A divider that hugs the content directly above it. */\n.divider-tight {\n margin-top: var(--wb-sizing-size_040) !important;\n}\n\n/* Indent for the example content text beside the copy/paste buttons. */\n.example-content-indent {\n margin-inline-start: var(--wb-sizing-size_040) !important;\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n}\n\n/* gap replaces the spacer that separated the header label from its swatch. */\n.header {\n gap: var(--wb-sizing-size_080) !important;\n}\n\n.space-under {\n margin-bottom: var(--wb-sizing-size_080) !important;\n}\n\n/* gap between the \"kind\" label and its select. */\n.kind-label {\n gap: var(--wb-sizing-size_040) !important;\n}\n\n/* gap between the color select and the line style select. */\n.color-row {\n gap: var(--wb-sizing-size_120) !important;\n}\n\n.error-text {\n color: var(--wb-semanticColor-core-foreground-critical-default) !important;\n}\n\n.add-button {\n align-self: start !important;\n}\n\n.horizontal-rule {\n height: 1px !important;\n background-color: var(\n --wb-semanticColor-core-border-neutral-subtle\n ) !important;\n}\n\n/* Top spacing for a section start (a divider opening a section, or a heading). */\n.section-top {\n margin-top: var(--wb-sizing-size_120) !important;\n}\n\n/* A divider that hugs the content directly above it. */\n.divider-tight {\n margin-top: var(--wb-sizing-size_040) !important;\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.row {\n flex-direction: row !important;\n align-items: center !important;\n /* gap replaces the Strut that separated the header label from its swatch. */\n gap: var(--wb-sizing-size_080) !important;\n}\n\n.add-button {\n align-self: start !important;\n}\n\n.horizontal-rule {\n height: 1px !important;\n background-color: var(\n --wb-semanticColor-core-border-neutral-subtle\n ) !important;\n}\n\n/* Top spacing for a section start (a divider opening a section, or a heading). */\n.section-top {\n margin-top: var(--wb-sizing-size_120) !important;\n}\n\n/* A divider that hugs the content directly above it. */\n.divider-tight {\n margin-top: var(--wb-sizing-size_040) !important;\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n}\n\n/* gap replaces the spacer that separated the header label from its swatch. */\n.header {\n gap: var(--wb-sizing-size_080) !important;\n}\n\n.space-under {\n margin-bottom: var(--wb-sizing-size_080) !important;\n}\n\n.color-row {\n margin-bottom: var(--wb-sizing-size_080) !important;\n /* gap replaces the spacer between the color select and the fill control. */\n gap: var(--wb-sizing-size_160) !important;\n}\n\n/* gap replaces the spacer between the \"fill\" label and its select. */\n.fill-label {\n gap: var(--wb-sizing-size_060) !important;\n}\n\n.icon {\n margin-inline-start: var(--wb-sizing-size_040) !important;\n}\n\n.polygon-actions-container {\n width: 100% !important;\n}\n\n.movement-buttons-container {\n display: flex !important;\n flex-direction: column !important;\n align-items: center !important;\n min-width: fit-content !important;\n}\n\n.truncated-width {\n /* Allow truncation, stop bleeding over the edge. */\n min-width: 0 !important;\n}\n\n.add-button {\n align-self: start !important;\n}\n\n.horizontal-rule {\n height: 1px !important;\n background-color: var(\n --wb-semanticColor-core-border-neutral-subtle\n ) !important;\n}\n\n/* Top spacing for a section start (a divider opening a section, or a heading). */\n.section-top {\n margin-top: var(--wb-sizing-size_120) !important;\n}\n\n/* A divider that hugs the content directly above it. */\n.divider-tight {\n margin-top: var(--wb-sizing-size_040) !important;\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.row {\n flex-direction: row !important;\n align-items: center !important;\n /* gap replaces the Strut that separated the header label from its swatch. */\n gap: var(--wb-sizing-size_080) !important;\n}\n\n.error-text {\n color: var(--wb-semanticColor-core-foreground-critical-default) !important;\n margin-top: var(--wb-sizing-size_080) !important;\n}\n\n.add-button {\n align-self: start !important;\n}\n\n.horizontal-rule {\n height: 1px !important;\n background-color: var(\n --wb-semanticColor-core-border-neutral-subtle\n ) !important;\n}\n\n/* Top spacing for a section start (a divider opening a section, or a heading). */\n.section-top {\n margin-top: var(--wb-sizing-size_120) !important;\n}\n\n/* A divider that hugs the content directly above it. */\n.divider-tight {\n margin-top: var(--wb-sizing-size_040) !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n.button-container {\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_120) !important;\n}\n\n.button {\n margin-top: var(--wb-sizing-size_080) !important;\n flex-grow: 1 !important;\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.tile {\n display: flex !important;\n flex-direction: column !important;\n gap: var(--wb-sizing-size_120) !important;\n background-color: var(\n --wb-semanticColor-core-background-instructive-subtle\n ) !important;\n margin-top: var(--wb-sizing-size_080) !important;\n padding: var(--wb-sizing-size_120) !important;\n border-radius: var(--wb-sizing-size_080) !important;\n}\n\n.tile-row {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_120) !important;\n background-color: var(\n --wb-semanticColor-core-background-instructive-subtle\n ) !important;\n margin-top: var(--wb-sizing-size_080) !important;\n padding: var(--wb-sizing-size_120) !important;\n border-radius: var(--wb-sizing-size_080) !important;\n}\n\n.label-field {\n display: flex !important;\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_060) !important;\n}\n\n.label-prefix {\n display: inline-block !important;\n min-inline-size: var(--wb-sizing-size_400) !important;\n text-align: right !important;\n}\n\n.text-field-wrapper {\n inline-size: var(--wb-sizing-size_800) !important;\n}\n\n.point-label-field {\n inline-size: var(--wb-sizing-size_640) !important;\n}\n\n.equationSection {\n margin-top: var(--wb-sizing-size_120) !important;\n}\n\n.equationBody {\n background-color: var(\n --wb-semanticColor-core-background-neutral-subtle\n ) !important;\n border: var(--wb-border-width-thin) solid\n var(--wb-semanticColor-core-border-neutral-subtle) !important;\n margin-top: var(--wb-sizing-size_080) !important;\n padding-left: var(--wb-sizing-size_080) !important;\n padding-right: var(--wb-sizing-size_080) !important;\n font-size: var(--wb-font-body-size-xsmall) !important;\n}\n\n.reset-button {\n margin-top: var(--wb-sizing-size_120) !important;\n}\n",".answers {\n margin-top: var(--wb-sizing-size_080);\n margin-bottom: var(--wb-sizing-size_120);\n}\n\n.answer {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--wb-sizing-size_160);\n}\n\n.add-answer-content {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--wb-sizing-size_160);\n color: var(--wb-semanticColor-link-rest);\n}\n\n.add-answer:hover .add-answer-content {\n text-decoration: underline;\n}\n\n.remove-button-content {\n display: inline-flex;\n color: var(--wb-semanticColor-core-foreground-critical-default);\n}\n\n.add-answer[aria-disabled=\"true\"],\n.remove-button[aria-disabled=\"true\"] {\n opacity: 0.5;\n}\n\n.add-answer:focus:not(:focus-visible),\n.remove-button:focus:not(:focus-visible) {\n outline: none;\n}\n\n.answer:not(:first-child) {\n margin-top: var(--wb-sizing-size_120);\n}\n",".options-list {\n margin-top: var(--wb-sizing-size_080);\n}\n\n.option {\n display: flex;\n padding: var(--wb-sizing-size_060) var(--wb-sizing-size_0);\n}\n\n.label {\n /* TODO: could we use WB typography? */\n font-family: inherit;\n font-size: 15px;\n line-height: 1.25;\n margin-left: var(--wb-sizing-size_160);\n color: #626569; /* gray17 */\n}\n\n.selectLabel {\n margin-right: var(--wb-sizing-size_080);\n}\n\n.editor {\n display: flex;\n flex-direction: column;\n gap: var(--wb-sizing-size_080);\n}\n",".image-row {\n display: flex;\n gap: var(--wb-sizing-size_160);\n margin-top: var(--wb-sizing-size_080);\n}\n",".tile {\n display: flex;\n flex-direction: column;\n background-color: var(\n --wb-semanticColor-core-background-instructive-subtle\n );\n border: 1px solid var(--wb-semanticColor-core-border-neutral-subtle);\n border-radius: var(--wb-sizing-size_120);\n padding-inline: var(--wb-sizing-size_120);\n padding-block: var(--wb-sizing-size_080);\n margin-block-start: var(--wb-sizing-size_120);\n margin-block-end: var(--wb-sizing-size_120);\n}\n\n.status-row {\n display: flex;\n flex-direction: row;\n align-items: center;\n flex-wrap: wrap;\n gap: var(--wb-sizing-size_080);\n margin-block-end: var(--wb-sizing-size_080);\n}\n\n.radio-option-actions-container {\n display: flex;\n flex-direction: row;\n align-items: center;\n margin-block-start: var(--wb-sizing-size_080);\n}\n\n.button-row {\n display: flex;\n flex-direction: row;\n align-items: center;\n margin-block-start: var(--wb-sizing-size_080);\n}\n\n.image-editor-container {\n display: flex;\n flex-direction: column;\n position: relative;\n padding: var(--wb-sizing-size_080);\n padding-block-start: var(--wb-sizing-size_240);\n border: 1px solid var(--wb-semanticColor-core-border-neutral-default);\n border-radius: var(--wb-sizing-size_080);\n margin-block-start: var(--wb-sizing-size_080);\n background-color: var(--wb-semanticColor-core-background-base-default);\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n\n/* A card's text sits on one line with the controls that reorder and remove it,\n so the controls stay next to the card they act on. */\n.card {\n flex-direction: row !important;\n align-items: center !important;\n gap: var(--wb-sizing-size_040) !important;\n}\n","/* TODO(LEMS-3686): Remove the !important once Wonder Blocks is in the shared layer. */\n\n/* Separates the three sections (cards, layout, padding) from each other. */\n.editor {\n gap: var(--wb-sizing-size_240) !important;\n}\n\n/* Separates a section's label from the control it describes. Smaller than the\n gap between sections so each label groups with its own control. */\n.section {\n gap: var(--wb-sizing-size_080) !important;\n}\n\n/* The cards always stack in the editor, regardless of the `layout` option,\n which only controls how the widget renders for students. */\n.cards {\n list-style: none !important;\n padding-inline-start: 0 !important;\n /* Drop the browser's default list margins; `section` and `editor` above\n own the spacing around the list. */\n margin-block: 0 !important;\n gap: var(--wb-sizing-size_120) !important;\n}\n\n/* Keep the button hugging its label rather than stretching to the width of the\n cards above it. */\n.add-card {\n align-self: flex-start !important;\n}\n"]}
package/dist/es/index.js CHANGED
@@ -67,7 +67,7 @@ import minusCircleIcon from '@phosphor-icons/core/bold/minus-circle-bold.svg';
67
67
  import arrowDown from '@phosphor-icons/core/regular/arrow-down.svg';
68
68
  import arrowUp from '@phosphor-icons/core/regular/arrow-up.svg';
69
69
 
70
- const libName="@khanacademy/perseus-editor";const libVersion="41.0.0";addLibraryVersionToPerseusDebug(libName,libVersion);
70
+ const libName="@khanacademy/perseus-editor";const libVersion="42.0.0";addLibraryVersionToPerseusDebug(libName,libVersion);
71
71
 
72
72
  var jsxRuntime = {exports: {}};
73
73
 
@@ -1527,7 +1527,7 @@ function buildDeviceApiOptions(inputs){return {...ApiOptions.defaults,...inputs.
1527
1527
 
1528
1528
  function lintRenderer(content,widgets){const parsed=PerseusMarkdown.parse(content,{});const linterContext={content,widgets,stack:[]};const linterIssues=(PerseusLinter.runLinter(parsed,linterContext,false)??[]).map(warning=>{if(warning.rule==="inaccessible-widget"){return WARNINGS.inaccessibleWidget(warning.metadata?.widgetType??"unknown",warning.metadata?.widgetId??"unknown")}return WARNINGS.genericLinterWarning(warning.rule,warning.message,warning.severity)});const texIssues=detectTexErrors(content).map((error,i)=>WARNINGS.texError(error.math,error.message,i));const ruleCounts=new Map;return [...linterIssues,...texIssues].map(issue=>{const ordinal=ruleCounts.get(issue.id)??0;ruleCounts.set(issue.id,ordinal+1);return {...issue,instanceId:issue.instanceId??`${issue.id}-${ordinal}`}})}function gatherLinterIssues(question,hints,hostIssues){const questionIssues=lintRenderer(question?.content??"",question?.widgets);const hintIssues=hints.flatMap((hint,i)=>lintRenderer(hint.content??"",hint.widgets??undefined).map(issue=>({...issue,id:`hint-${i+1}-${issue.id}`,instanceId:`hint-${i+1}-${getIssueKey(issue)}`,message:`Hint ${i+1}: ${issue.message}`})));return [...hostIssues??[],...questionIssues,...hintIssues]}
1529
1529
 
1530
- const{HUD}=components;class EditorPage extends React.Component{componentDidMount(){this.setState({issues:gatherLinterIssues(this.props.question,this.props.hints,this.props.issues)});}getSnapshotBeforeUpdate(prevProps){if(!prevProps.jsonMode&&this.props.jsonMode){return this.itemEditor.current?.serialize()??{}}return null}componentDidUpdate(previousProps,prevState,snapshot){if(snapshot){this.setState({json:snapshot});return}if(!_.isEqual(previousProps.question,this.props.question)||!_.isEqual(previousProps.answerArea,this.props.answerArea)||!_.isEqual(previousProps.hints,this.props.hints)){this.syncJsonStateFromProps();}const questionOrHintsChanged=previousProps.question?.content!==this.props.question?.content||previousProps.question?.widgets!==this.props.question?.widgets||!_.isEqual(previousProps.hints,this.props.hints);if(questionOrHintsChanged){this.setState({issues:gatherLinterIssues(this.props.question,this.props.hints,this.props.issues)});}}syncJsonStateFromProps(){this.setState({json:{question:this.props.question,answerArea:this.props.answerArea,hints:this.props.hints}});}getSaveWarnings(){return this.itemEditor.current?.getSaveWarnings()}serialize(){if(this.props.jsonMode){return this.state.json}invariant(this.itemEditor.current,"cannot serialize EditorPage without ItemEditor");return this.itemEditor.current.serialize()}render(){let className="framework-perseus";const editingDisabled=this.props.apiOptions?.editingDisabled??false;const touch=this.props.previewDevice==="phone"||this.props.previewDevice==="tablet";const deviceBasedApiOptions=this.deriveDeviceApiOptions({apiOptions:this.props.apiOptions,touch});const showEditor=!this.props.developerMode||!this.props.jsonMode;if(deviceBasedApiOptions.isMobile){className+=" "+ClassNames.MOBILE;}return jsxRuntimeExports.jsx(Dependencies.DependenciesContext.Provider,{value:this.props.dependencies,children:jsxRuntimeExports.jsx(ItemEditorContext.Provider,{value:{question:this.props.question,onEditorChange:this.handleEditorChange,editingDisabled:this.props.apiOptions?.editingDisabled},children:jsxRuntimeExports.jsxs("div",{id:"perseus",className:className,children:[jsxRuntimeExports.jsxs("div",{style:{marginBlockEnd:10},children:[this.props.developerMode&&jsxRuntimeExports.jsxs("span",{children:[jsxRuntimeExports.jsxs("label",{children:[" ","Developer JSON Mode:"," ",jsxRuntimeExports.jsx("input",{type:"checkbox",checked:this.props.jsonMode,disabled:this.props.apiOptions?.editingDisabled,onChange:this.toggleJsonMode})]})," "]}),!this.props.jsonMode&&jsxRuntimeExports.jsx(ViewportResizer,{deviceType:this.props.previewDevice,onViewportSizeChanged:this.props.onPreviewDeviceChange}),!this.props.jsonMode&&jsxRuntimeExports.jsx(HUD,{message:"Style warnings",enabled:this.state.highlightLint,onClick:()=>{this.setState({highlightLint:!this.state.highlightLint});}})]}),this.props.developerMode&&this.props.jsonMode&&jsxRuntimeExports.jsx("div",{children:jsxRuntimeExports.jsx(JsonEditor,{multiLine:true,value:this.state.json,parser:parseAndMigratePerseusItem,onChange:this.changeJSON,editingDisabled:editingDisabled})}),jsxRuntimeExports.jsxs(A11yContext.Provider,{value:createA11yContextValue({setIssueHighlight:this.setIssueHighlight,a11yScanningEnabled:this.state.a11yScanningEnabled,setA11yScanningEnabled:this.setA11yScanningEnabled,highlightInstanceIds:this.state.highlightInstanceIds,onA11yReport:this.handleA11yReport,axeCoreIssues:this.state.axeCoreIssues}),children:[showEditor&&jsxRuntimeExports.jsx("div",{className:"perseus-editor-table",children:jsxRuntimeExports.jsx("div",{className:"perseus-editor-row",children:jsxRuntimeExports.jsx("div",{className:"perseus-editor-left-cell",children:jsxRuntimeExports.jsx(IssuesPanel,{issues:this.state.issues})})})}),showEditor&&jsxRuntimeExports.jsx(ItemEditor,{ref:this.itemEditor,itemId:this.props.itemId,question:this.props.question,hints:this.props.hints,answerArea:this.props.answerArea,imageUploader:this.props.imageUploader,onChange:this.handleChange,deviceType:this.props.previewDevice,widgetIsOpen:this.state.widgetsAreOpen,apiOptions:deviceBasedApiOptions,previewURL:this.props.previewURL,additionalTemplates:this.props.additionalTemplates,highlightLint:this.state.highlightLint,problemNum:this.props.problemNum})]})]})})})}constructor(props){super(props),this.itemEditor=React.createRef(),this.deriveDeviceApiOptions=createDeviceApiOptionsDeriver(),this.setIssueHighlight=(instanceId,highlighted)=>{this.setState(prevState=>{const current=prevState.highlightInstanceIds;if(highlighted===current.includes(instanceId)){return null}return {highlightInstanceIds:highlighted?[...current,instanceId]:current.filter(id=>id!==instanceId)}});},this.handleA11yReport=report=>{this.setState({axeCoreIssues:report?[...report.violations,...report.needsReview]:[]});},this.setA11yScanningEnabled=enabled=>{this.setState({a11yScanningEnabled:enabled});},this.toggleJsonMode=()=>{this.setState({json:this.serialize()},()=>{this.props.onChange({jsonMode:!this.props.jsonMode});});},this.handleChange=toChange=>{const newProps=_(this.props).pick("question","hints","answerArea");_(newProps).extend(toChange);this.props.onChange(newProps);},this.handleEditorChange=newProps=>{this.handleChange({question:{...this.props.question,...newProps}});},this.changeJSON=newJson=>{this.setState({json:newJson});this.props.onChange(newJson);};this.state={json:_.pick(this.props,"question","answerArea","hints"),highlightLint:true,widgetsAreOpen:this.props.widgetsAreOpen??true,issues:[],axeCoreIssues:[],a11yScanningEnabled:false,highlightInstanceIds:[]};}}EditorPage.defaultProps={answerArea:getDefaultAnswerArea(),developerMode:false,hints:[],jsonMode:false,onChange:()=>{}};
1530
+ const{HUD}=components;class EditorPage extends React.Component{componentDidMount(){this.setState({issues:gatherLinterIssues(this.props.question,this.props.hints,this.props.issues)});}getSnapshotBeforeUpdate(prevProps){if(!prevProps.jsonMode&&this.props.jsonMode){return this.itemEditor.current?.serialize()??{}}return null}componentDidUpdate(previousProps,prevState,snapshot){if(snapshot){this.setState({json:snapshot});return}if(!_.isEqual(previousProps.question,this.props.question)||!_.isEqual(previousProps.answerArea,this.props.answerArea)||!_.isEqual(previousProps.hints,this.props.hints)){this.syncJsonStateFromProps();}const questionOrHintsChanged=previousProps.question?.content!==this.props.question?.content||previousProps.question?.widgets!==this.props.question?.widgets||!_.isEqual(previousProps.hints,this.props.hints);if(questionOrHintsChanged){this.setState({issues:gatherLinterIssues(this.props.question,this.props.hints,this.props.issues)});}}syncJsonStateFromProps(){this.setState({json:{question:this.props.question,answerArea:this.props.answerArea,hints:this.props.hints}});}getSaveWarnings(){return this.itemEditor.current?.getSaveWarnings()}serialize(){if(this.props.jsonMode){return this.state.json}invariant(this.itemEditor.current,"cannot serialize EditorPage without ItemEditor");return this.itemEditor.current.serialize()}render(){let className="framework-perseus";const editingDisabled=this.props.apiOptions?.editingDisabled??false;const touch=this.props.previewDevice==="phone"||this.props.previewDevice==="tablet";const deviceBasedApiOptions=this.deriveDeviceApiOptions({apiOptions:this.props.apiOptions,touch});if(deviceBasedApiOptions.isMobile){className+=" "+ClassNames.MOBILE;}return jsxRuntimeExports.jsx(Dependencies.DependenciesContext.Provider,{value:this.props.dependencies,children:jsxRuntimeExports.jsx(ItemEditorContext.Provider,{value:{question:this.props.question,onEditorChange:this.handleEditorChange,editingDisabled:this.props.apiOptions?.editingDisabled},children:jsxRuntimeExports.jsxs("div",{id:"perseus",className:className,children:[jsxRuntimeExports.jsx("div",{style:{marginBlockEnd:10},children:!this.props.jsonMode&&jsxRuntimeExports.jsx(HUD,{message:"Style warnings",enabled:this.state.highlightLint,onClick:()=>{this.setState({highlightLint:!this.state.highlightLint});}})}),this.props.jsonMode?jsxRuntimeExports.jsx("div",{children:jsxRuntimeExports.jsx(JsonEditor,{multiLine:true,value:this.state.json,parser:parseAndMigratePerseusItem,onChange:this.changeJSON,editingDisabled:editingDisabled})}):jsxRuntimeExports.jsxs(A11yContext.Provider,{value:createA11yContextValue({setIssueHighlight:this.setIssueHighlight,a11yScanningEnabled:this.state.a11yScanningEnabled,setA11yScanningEnabled:this.setA11yScanningEnabled,highlightInstanceIds:this.state.highlightInstanceIds,onA11yReport:this.handleA11yReport,axeCoreIssues:this.state.axeCoreIssues}),children:[jsxRuntimeExports.jsx("div",{className:"perseus-editor-table",children:jsxRuntimeExports.jsx("div",{className:"perseus-editor-row",children:jsxRuntimeExports.jsx("div",{className:"perseus-editor-left-cell",children:jsxRuntimeExports.jsx(IssuesPanel,{issues:this.state.issues})})})}),jsxRuntimeExports.jsx(ItemEditor,{ref:this.itemEditor,itemId:this.props.itemId,question:this.props.question,hints:this.props.hints,answerArea:this.props.answerArea,imageUploader:this.props.imageUploader,onChange:this.handleChange,deviceType:this.props.previewDevice,widgetIsOpen:this.state.widgetsAreOpen,apiOptions:deviceBasedApiOptions,previewURL:this.props.previewURL,additionalTemplates:this.props.additionalTemplates,highlightLint:this.state.highlightLint,problemNum:this.props.problemNum})]})]})})})}constructor(props){super(props),this.itemEditor=React.createRef(),this.deriveDeviceApiOptions=createDeviceApiOptionsDeriver(),this.setIssueHighlight=(instanceId,highlighted)=>{this.setState(prevState=>{const current=prevState.highlightInstanceIds;if(highlighted===current.includes(instanceId)){return null}return {highlightInstanceIds:highlighted?[...current,instanceId]:current.filter(id=>id!==instanceId)}});},this.handleA11yReport=report=>{this.setState({axeCoreIssues:report?[...report.violations,...report.needsReview]:[]});},this.setA11yScanningEnabled=enabled=>{this.setState({a11yScanningEnabled:enabled});},this.handleChange=toChange=>{const newProps=_(this.props).pick("question","hints","answerArea");_(newProps).extend(toChange);this.props.onChange(newProps);},this.handleEditorChange=newProps=>{this.handleChange({question:{...this.props.question,...newProps}});},this.changeJSON=newJson=>{this.setState({json:newJson});this.props.onChange(newJson);};this.state={json:_.pick(this.props,"question","answerArea","hints"),highlightLint:true,widgetsAreOpen:this.props.widgetsAreOpen??true,issues:[],axeCoreIssues:[],a11yScanningEnabled:false,highlightInstanceIds:[]};}}EditorPage.defaultProps={answerArea:getDefaultAnswerArea(),hints:[],jsonMode:false,onChange:()=>{}};
1531
1531
 
1532
1532
  function ContentPreview({question,apiOptions,seamless,linterContext,legacyPerseusLint,previewDevice,reviewMode}){const i18n=usePerseusI18n();const isMobile=previewDevice!=="desktop";const className=isMobile?"perseus-mobile":"";return jsxRuntimeExports.jsx(View,{className:`framework-perseus ${className}`,style:[styles$P.container,!seamless?styles$P.gutter:undefined],children:jsxRuntimeExports.jsx(StatefulKeypadContextProvider,{children:jsxRuntimeExports.jsx(KeypadContext.Consumer,{children:({setKeypadActive,keypadElement,setKeypadElement})=>jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment,{children:[jsxRuntimeExports.jsx(UserInputManager,{widgets:question?.widgets||{},problemNum:0,children:({userInput,handleUserInput,initializeUserInput})=>jsxRuntimeExports.jsx(Renderer,{strings:i18n.strings,apiOptions:{...apiOptions,isMobile},keypadElement:keypadElement,linterContext:linterContext,legacyPerseusLint:legacyPerseusLint,userInput:userInput,handleUserInput:handleUserInput,initializeUserInput:initializeUserInput,reviewMode:reviewMode,...question})}),jsxRuntimeExports.jsx(MobileKeypad,{onAnalyticsEvent:()=>Promise.resolve(),onDismiss:()=>setKeypadActive(false),onElementMounted:setKeypadElement})]})})})})}const styles$P=StyleSheet.create({container:{padding:spacing.xxxSmall_4,containerType:"inline-size",containerName:"perseus-root"},gutter:{marginInlineEnd:lintGutterWidth}});
1533
1533