html,
 body {
     margin: 0;
     padding: 0;
     height: 100%
 }

 #mnf__scope_8c3 {
     --bg: #070b16;
     --panel: #0b1222;
     --panel-2: #0a1120;
     --text: #eaf2ff;
     --muted: #9fb0c8;
     --chip: #122330;
     --chip-ring: #2c4858;
     --accent: #00c6ff;
     --accent-strong: #72ede5;
     --shadow: 0 12px 34px rgba(8, 12, 25, .55), inset 0 1px 0 rgba(255, 255, 255, .04);
     --danger: #ff6b6b;
     --placeholder: #b7c6d8
 }

 #mnf__scope_8c3 * {
     box-sizing: border-box
 }

 #mnf__scope_8c3 {
     font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
     color: var(--text);
     background: #000;
     min-height: 100vh;
     overflow-x: hidden
 }

 #mnf__scope_8c3 html,
 #mnf__scope_8c3 body {
     margin: 0
 }

 #mnf__scope_8c3 body {
     color: var(--text);
     background: #000;
     min-height: 100vh;
     overflow-x: hidden
 }

 #mnf__scope_8c3 button,
 #mnf__scope_8c3 input,
 #mnf__scope_8c3 select,
 #mnf__scope_8c3 textarea {
     font: inherit
 }

 #mnf__scope_8c3 input::placeholder,
 #mnf__scope_8c3 textarea::placeholder {
     color: var(--placeholder);
     opacity: .8
 }

 #mnf__scope_8c3 input:focus::placeholder,
 #mnf__scope_8c3 textarea:focus::placeholder {
     opacity: .55;
     transition: opacity .2s
 }

 #mnf__scope_8c3 input:disabled::placeholder,
 #mnf__scope_8c3 textarea:disabled::placeholder {
     opacity: .35
 }

 #mnf__scope_8c3 .mnf-mt-18 {
     margin-top: 30px !important
 }

 #mnf__scope_8c3 .container {
     width: 100%;
     display: grid;
     grid-template-columns: 520px 1fr;
     gap: 0;
     align-items: stretch;
     position: relative;
     z-index: 0;
     overflow: hidden
 }

 #mnf__scope_8c3 .orb {
     position: absolute;
     border-radius: 9999px;
     filter: blur(28px);
     pointer-events: none;
     z-index: -1
 }

 #mnf__scope_8c3 .orb-left {
     width: 460px;
     height: 460px;
     left: 0;
     top: 0;
     background: radial-gradient(260px 260px at 55% 40%, rgba(0, 198, 255, .35), rgba(0, 255, 224, .18) 40%, transparent 70%), radial-gradient(520px 420px at 15% 85%, rgba(0, 255, 224, .15), transparent 70%)
 }

 #mnf__scope_8c3 .panel {
     background: linear-gradient(180deg, var(--panel), var(--panel-2));
     box-shadow: var(--shadow);
     position: relative;
     isolation: isolate;
     height: 100vh;
     padding-bottom: 26px;
     padding-top: 20px;
     overflow-y: scroll
 }

 #mnf__scope_8c3 .brand {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 10px;
     margin: 15px 0 0
 }

 #mnf__scope_8c3 .section {
     margin-top: 30px
 }

 #mnf__scope_8c3 .section#mnf-promptSection {
     margin-top: 30px;
     padding: 0 26px
 }

 #mnf__scope_8c3 #mnf-promptHeading {
     padding: 0
 }

 #mnf__scope_8c3 .section h2 {
     font-size: 14px;
     font-weight: 700;
     letter-spacing: .4px;
     margin: 0 0 10px;
     color: #cfe0ff;
     display: flex;
     justify-content: space-between;
     padding: 0 26px
 }

 #mnf__scope_8c3 .chip {
     font-size: 14px !important
 }

 #mnf__scope_8c3 .chip-grid {
     display: grid;
     grid-template-columns: repeat(3, minmax(0, 1fr));
     gap: 0
 }

 #mnf__scope_8c3 .chip {
     appearance: none;
     border: 1px solid rgba(0, 198, 255, .22);
     background: transparent;
     color: #d7e6f6;
     padding: 0 14px;
     border-radius: 0;
     cursor: pointer;
     text-align: center;
     font-weight: 400;
     letter-spacing: .2px;
     transition: .2s ease;
     outline: none;
     user-select: none;
     white-space: nowrap;
     text-wrap: auto;
     height: 35px;
     box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04), 0 1px 0 rgba(0, 0, 0, .35)
 }

 #mnf__scope_8c3 .chip:hover {
     background: linear-gradient(180deg, #183247, #13293c);
     border-color: rgba(0, 198, 255, .32)
 }

 #mnf__scope_8c3 .chip.active {
     background: #00c6ff;
     color: #061a1a;
     border-color: transparent;
     box-shadow: 0 8px 24px rgba(0, 198, 255, .35);
     font-weight: 600
 }

 #mnf__scope_8c3 textarea {
     width: 100%;
     min-height: 140px;
     resize: vertical;
     border-radius: 8px;
     padding: 14px 14px 34px;
     border: 1px solid rgba(0, 198, 255, .22);
     background: radial-gradient(550px 500px at 30% 71%, rgba(0, 198, 255, .2), transparent 55%), radial-gradient(500px 500px at 60% -20%, rgba(60, 140, 255, .14), transparent 75%), linear-gradient(180deg, #071318, #0a1520 65%, #08121a);
     color: #e9f2ff;
     line-height: 1.6;
     font-size: 14px;
     outline: none;
     box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04)
 }

 #mnf__scope_8c3 .input {
     width: 100%;
     min-height: 48px;
     border-radius: 8px;
     padding: 12px 14px;
     border: 1px solid var(--chip-ring);
     background: radial-gradient(550px 500px at 30% 71%, rgba(0, 198, 255, .2), transparent 55%), radial-gradient(500px 500px at 60% -20%, rgba(60, 140, 255, .14), transparent 75%), linear-gradient(180deg, #071318, #0a1520 65%, #08121a);
     color: #e9f2ff;
     line-height: 1.5;
     font-size: 14px;
     outline: none;
     box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04)
 }

 #mnf__scope_8c3 .help-row {
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin-top: 6px;
     color: var(--muted);
     font-size: 12px
 }

 #mnf__scope_8c3 .help-row .error {
     color: var(--danger);
     margin-left: auto
 }

 #mnf__scope_8c3 .btn-primary {
     width: 100%;
     margin-top: 14px;
     padding: 14px 16px;
     border: 0;
     border-radius: 10px;
     cursor: pointer;
     font-weight: 800;
     letter-spacing: .3px;
     font-size: 15px;
     background: #00c3ff;
     color: #051b1a;
     box-shadow: 0 10px 28px rgba(0, 198, 255, .35)
 }

 #mnf__scope_8c3 .btn-primary:active {
     transform: translateY(1px)
 }

 #mnf__scope_8c3 .btn-primary[disabled] {
     opacity: .5;
     cursor: not-allowed;
     box-shadow: none
 }

 #mnf__scope_8c3 .preview-wrap {
     position: relative;
     box-shadow: 0 20px 40px rgba(10, 20, 40, .35);
     display: flex;
     align-items: stretch;
     justify-content: flex-start;
     overflow: hidden;
     height: 100%
 }

 #mnf__scope_8c3 .paper {
     width: 100%;
     background: #fff;
     color: #0b0d12;
     padding: 0px 96px;
     overflow: auto;
     height: 100vh;
     overflow-x: hidden
 }

 #mnf__scope_8c3 .script {
     font-family: "Courier Prime", ui-monospace, Menlo, Monaco, Consolas, "Courier New", monospace;
     line-height: 1.6;
     font-size: 15px;
     white-space: pre-wrap
 }

 #mnf__scope_8c3 .type-section {
     display: none
 }

 #mnf__scope_8c3 .type-section.active {
     display: block
 }

 #mnf__scope_8c3 .hidden {
     display: none !important
 }

 #mnf__scope_8c3 .step {
     display: none
 }

 #mnf__scope_8c3 .step.active {
     display: block
 }

 #mnf__scope_8c3 .select-wrap {
     position: relative
 }

 #mnf__scope_8c3 .select-btn {
     width: 100%;
     background: radial-gradient(550px 500px at 60% 1%, rgba(0, 198, 255, .2), transparent 55%), radial-gradient(500px 500px at 60% -90%, rgba(60, 140, 255, .14), transparent 75%), linear-gradient(180deg, #071318, #0a1520 65%, #08121a);
     border: 1px solid var(--chip-ring);
     color: #dbe7ff;
     border-radius: 8px;
     padding: 12px 44px 12px 14px;
     font-weight: 600;
     cursor: pointer;
     text-align: left;
     appearance: none
 }

 #mnf__scope_8c3 .select-btn:focus {
     outline: none;
     box-shadow: 0 0 0 3px rgba(0, 198, 255, .25);
     border-color: #00c3ff
 }

 #mnf__scope_8c3 .select-caret {
     position: absolute;
     right: 14px;
     top: 50%;
     transform: translateY(-50%);
     width: 18px;
     height: 18px;
     pointer-events: none;
     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2389F4ED' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
     background-repeat: no-repeat;
     background-size: 18px 18px;
     background-position: center
 }

 #mnf__scope_8c3 .select-menu {
     position: absolute;
     left: 0;
     right: 0;
     top: calc(100% + 6px);
     background: linear-gradient(180deg, var(--panel), var(--panel-2));
     border: 1px solid rgba(0, 198, 255, .22);
     border-radius: 12px;
     padding: 6px;
     list-style: none;
     margin: 0;
     max-height: 260px;
     overflow: auto;
     box-shadow: var(--shadow);
     display: none;
     z-index: 150
 }

 #mnf__scope_8c3 .select-wrap.open .select-menu {
     display: block
 }

 #mnf__scope_8c3 .opt {
     padding: 10px 12px;
     border-radius: 8px;
     cursor: pointer;
     color: #dbe7ff
 }

 #mnf__scope_8c3 .opt:hover,
 #mnf__scope_8c3 .opt.is-active {
     background: #163142
 }

 #mnf__scope_8c3 .form-grid {
     display: grid;
     grid-template-columns: 1fr;
     gap: 14px;
     margin-top: 8px
 }

 #mnf__scope_8c3 .field {
     display: flex;
     flex-direction: column;
     align-items: flex-start;
     gap: 14px
 }

 #mnf__scope_8c3 .field label {
     font-weight: 400;
     color: #cfe0ff;
     font-size: 13px;
     width: 210px
 }

 #mnf__scope_8c3 .field textarea {
     min-height: 80px
 }

 #mnf__scope_8c3 #mnf-generate,
 #mnf__scope_8c3 #mnf-confirm {
     width: 100%;
     z-index: 20
 }

 #mnf__scope_8c3 .preview-header {
     display: none;
     align-items: center;
     gap: 12px;
     padding: 12px 16px;
     background: linear-gradient(180deg, var(--accent-strong), var(--accent));
     color: #052626;
     position: sticky;
     top: 0;
     z-index: 40
 }

 #mnf__scope_8c3 .back-btn {
     background: transparent;
     color: #dbe7ff;
     border: 1px solid rgba(0, 198, 255, .22);
     border-radius: 8px;
     padding: 8px 10px;
     cursor: pointer;
     position: absolute;
     top: 38px;
     font-size: 20px
 }

 #mnf__scope_8c3 .preview-meta {
     display: flex;
     flex-direction: column;
     gap: 2px;
     font-size: 13px
 }

 #mnf__scope_8c3 .preview-selections {
     font-weight: 700;
     color: #052626
 }

 #mnf__scope_8c3 .preview-title {
     color: #052626;
     opacity: .75;
     font-size: 12px
 }

 #mnf__scope_8c3 .mobile-select {
     display: none
 }

 #mnf__scope_8c3 #mnf-step2,
 #mnf__scope_8c3 .corp-film {
     padding: 0 26px
 }

 .script-line {
     margin-bottom: .5rem;
     line-height: 1.5
 }

 .slugline {
     text-align: left;
     color: #252525;
     text-transform: uppercase;
     letter-spacing: .05em;
     font-size: .875rem
 }

 .action {
     text-align: left;
     color: #616161
 }

 .speaker {
     text-align: center;
     color: #1f2937;
     text-transform: uppercase;
     letter-spacing: .08em;
     font-size: .875rem;
     margin-top: 1rem
 }

 .transition {
     text-align: right;
     font-style: italic;
     color: #616161;
     text-transform: uppercase;
     letter-spacing: .05em;
     font-size: .875rem;
     margin-top: .75rem
 }

 .dialogue {
     text-align: left;
     color: #374151;
     width: 50%;
     margin: auto
 }

 .parenthetical {
     text-align: center;
     font-style: italic;
     color: #616161;
     font-size: .875rem;
     margin-left: 3%;
     margin-right: 3%
 }

 #mnf__scope_8c3 .step-2-heading {
     margin-top: 70px
 }

 #mnf__scope_8c3 .section.host {
     padding: 0 26px
 }

 #mnf__scope_8c3 .section.host h2 {
     padding: 0
 }

 #mnf__scope_8c3 .mobile-select[data-mobile-target="host"] {
     display: none !important
 }

 #mnf__scope_8c3 .script,
 #mnf__scope_8c3 .script pre {
     white-space: pre-wrap;
     word-break: break-word;
     overflow-wrap: anywhere;
     margin: 0;
     max-width: 100%
 }

 @media (max-width:992px) {

     #mnf__scope_8c3 #mnf-generate,
     #mnf__scope_8c3 #mnf-confirm {
         width: auto
     }

     #mnf__scope_8c3 .container {
         grid-template-columns: 1fr;
         width: 100%;
         margin: 0;
         gap: 0
     }

     #mnf__scope_8c3 .preview-wrap {
         display: none
     }

     #mnf__scope_8c3 .container.mobile-preview .panel {
         display: none !important
     }

     #mnf__scope_8c3 .container.mobile-preview .preview-wrap {
         display: block !important
     }

     #mnf__scope_8c3 #mnf-generate,
     #mnf__scope_8c3 #mnf-confirm {
         width: 100%;
         z-index: 120 !important
     }

     #mnf__scope_8c3 .panel {
         padding-bottom: 26px;
         min-height: 100vh
     }

     #mnf__scope_8c3 .paper {
         padding: 20px
     }

     #mnf__scope_8c3 .preview-header {
         display: flex
     }

     #mnf__scope_8c3 .chip-grid[role="radiogroup"] {
         display: none !important
     }

     #mnf__scope_8c3 .mobile-select {
         display: block
     }
 }

 @media (max-width:1200px) {
     #mnf__scope_8c3 .paper {
         padding: 20px
     }
 }

 #mnf__scope_8c3 #mnf-step2 .options-list {
     display: grid;
     gap: 14px;
     margin-top: 12px
 }

 #mnf__scope_8c3 #mnf-step2 .option-card {
     display: flex;
     gap: 12px;
     align-items: flex-start;
     padding: 14px;
     border-radius: 8px;
     border: 1px solid rgba(0, 198, 255, .22);
     background: linear-gradient(180deg, #0c1524, #0a1320);
     box-shadow: 0 12px 34px rgba(8, 12, 25, .55), inset 0 1px 0 rgba(255, 255, 255, .04);
     cursor: pointer
 }

 #mnf__scope_8c3 #mnf-step2 .option-card:hover {
     border-color: rgba(0, 198, 255, .35);
     background: linear-gradient(180deg, #112034, #0d1a2b)
 }

 #mnf__scope_8c3 #mnf-step2 .option-card.is-selected {
     outline: 2px solid var(--accent)
 }

 #mnf__scope_8c3 #mnf-step2 .option-card input[type="radio"] {
     appearance: none;
     -webkit-appearance: none;
     width: 20px;
     height: 20px;
     flex: 0 0 20px;
     margin: 4px 2px 0 2px;
     border-radius: 50%;
     border: 2px solid rgba(0, 198, 255, .85);
     background: transparent;
     box-shadow: 0 0 0 1px rgba(0, 198, 255, .18);
     outline: none;
     cursor: pointer
 }

 #mnf__scope_8c3 #mnf-step2 .option-card input[type="radio"]:focus-visible {
     box-shadow: 0 0 0 3px rgba(0, 198, 255, .25), 0 0 0 1px rgba(0, 198, 255, .18)
 }

 #mnf__scope_8c3 #mnf-step2 .option-card input[type="radio"]:checked {
     background: radial-gradient(circle at 50% 50%, rgba(0, 198, 255, 1) 44%, transparent 46%);
     border-color: rgba(0, 198, 255, .95)
 }

 #mnf__scope_8c3 #mnf-step2 .option-text {
     color: #e6f0ff;
     font-size: 14px;
     line-height: 1.55
 }

 #mnf__scope_8c3 .mobile-appbar {
     display: none
 }

 @media (max-width:992px) {

     #mnf__scope_8c3 .panel,
     #mnf__scope_8c3 .preview-wrap,
     #mnf__scope_8c3 .preview-header,
     #mnf__scope_8c3 .select-btn,
     #mnf__scope_8c3 .select-menu,
     #mnf__scope_8c3 .input,
     #mnf__scope_8c3 textarea,
     #mnf__scope_8c3 .btn-primary,
     #mnf__scope_8c3 .option-card {
         border-radius: 8px !important
     }

     #mnf__scope_8c3 .paper {
         border-radius: 0 !important
     }

     #mnf__scope_8c3 .mobile-appbar {
         display: flex;
         align-items: center;
         gap: 12px;
         position: sticky;
         top: 0;
         z-index: 200;
         padding: 12px 14px;
         background: var(--accent);
         color: #052626;
         border-bottom: 1px solid rgba(0, 0, 0, .08)
     }

     #mnf__scope_8c3 .mobile-appbar .appbar-back {
         background: transparent;
         border: 0;
         cursor: pointer;
         font-size: 20px;
         line-height: 1;
         color: #052626;
         padding: 6px 8px
     }

     #mnf__scope_8c3 .mobile-appbar .stack {
         display: flex;
         flex-direction: column;
         gap: 2px
     }

     #mnf__scope_8c3 .mobile-appbar .appbar-brand {
         font-weight: 900;
         font-size: 12px;
         letter-spacing: .12em
     }

     #mnf__scope_8c3 .mobile-appbar .appbar-sub {
         font-size: 13px;
         font-weight: 600;
         color: #052626
     }

     #mnf__scope_8c3 #mnf-appbar {
         display: none !important
     }

     #mnf__scope_8c3 .container.mobile-preview #mnf-appbar {
         display: flex !important;
         position: sticky;
         top: 0;
         z-index: 200;
         padding: 12px 14px;
         background: var(--accent);
         color: #052626;
         border-bottom: 1px solid rgba(0, 0, 0, .08)
     }
 }

 #mnf__scope_8c3 .gate {
     position: absolute;
     inset: 0;
     display: flex;
     align-items: center;
     justify-content: center;
     opacity: 0;
     visibility: hidden;
     pointer-events: none;
     backdrop-filter: blur(0);
     background: rgba(255, 255, 255, 0);
     color: #0a1a22;
     z-index: 50;
     transition: opacity .55s cubic-bezier(.22, .61, .36, 1), visibility .55s step-end, backdrop-filter .65s cubic-bezier(.22, .61, .36, 1), background .65s cubic-bezier(.22, .61, .36, 1)
 }

 #mnf__scope_8c3 .gate.visible {
     opacity: 1;
     visibility: visible;
     pointer-events: auto;
     height: inherit;
     backdrop-filter: blur(8px);
     background: rgba(255, 255, 255, .65);
     transition: opacity .55s cubic-bezier(.22, .61, .36, 1), visibility .55s step-start, backdrop-filter .65s cubic-bezier(.22, .61, .36, 1), background .65s cubic-bezier(.22, .61, .36, 1)
 }

 #mnf__scope_8c3 .gate-card {
     position: relative;
     width: min(520px, 86%);
     text-align: center;
     background: #fff;
     border-radius: 12px;
     padding: 26px 20px;
     border: 1px solid #e8f2ff;
     box-shadow: 0 12px 36px rgba(0, 0, 0, .18);
     opacity: 0;
     transform: translateY(18px) scale(.985);
     filter: blur(2px);
     transition: opacity .6s cubic-bezier(.22, .61, .36, 1), transform .7s cubic-bezier(.22, 1, .36, 1), filter .6s cubic-bezier(.22, .61, .36, 1), box-shadow .6s cubic-bezier(.22, .61, .36, 1)
 }

 #mnf__scope_8c3 .gate.visible .gate-card {
     opacity: 1;
     transform: translateY(0) scale(1);
     filter: blur(0);
     box-shadow: 0 26px 64px rgba(0, 0, 0, .22)
 }

 #mnf__scope_8c3 .gate-title {
     font-weight: 800;
     margin: 2px 0 8px;
     color: #0d2030
 }

 #mnf__scope_8c3 .gate-sub {
     color: #334b63;
     font-weight: 600;
     margin-bottom: 16px
 }

 #mnf__scope_8c3 .gate-btn {
     background: var(--accent);
     color: #052626;
     border: 0;
     padding: 12px 16px;
     border-radius: 8px;
     font-weight: 800;
     cursor: pointer;
     box-shadow: 0 10px 20px rgba(0, 185, 173, .35);
     text-decoration: none;
     margin-top: 12px;
     display: inline-block
 }

 #mnf__scope_8c3 .gate-close {
     position: absolute;
     top: 10px;
     right: 10px;
     width: 32px;
     height: 32px;
     display: grid;
     place-items: center;
     background: transparent;
     border: none;
     border-radius: 8px;
     color: #2c465a;
     cursor: pointer
 }

 #mnf__scope_8c3 .gate-close:focus-visible {
     outline: 2px solid var(--accent);
     outline-offset: 2px
 }

 @media (prefers-reduced-motion:reduce) {

     #mnf__scope_8c3 .gate,
     #mnf__scope_8c3 .gate-card,
     #mnf__scope_8c3 .gate-title,
     #mnf__scope_8c3 .gate-sub,
     #mnf__scope_8c3 .gate-btn {
         transition: none !important
     }
 }

 #mnf__scope_8c3 .gate,
 #mnf__scope_8c3 .gate * {
     pointer-events: none
 }

 #mnf__scope_8c3 .gate-card,
 #mnf__scope_8c3 .gate-card * {
     pointer-events: auto
 }

 #mnf__scope_8c3 .prompt-wrap {
     position: relative
 }

 #mnf__scope_8c3 .prompt-wrap textarea {
     padding-right: 48px
 }

 #mnf__scope_8c3 .kbd-btn {
     position: absolute;
     right: 10px;
     bottom: 10px;
     width: 34px;
     height: 34px;
     display: grid;
     place-items: center;
     background: radial-gradient(550px 500px at 60% 1%, rgba(0, 198, 255, .2), transparent 55%), linear-gradient(180deg, #0b1723, #0d1b2a);
     color: #cfe8ff;
     border: 1px solid #2a4a5e;
     border-radius: 8px;
     box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
     cursor: pointer
 }

 #mnf__scope_8c3 .kbd-btn:hover {
     background: radial-gradient(550px 500px at 60% 1%, rgba(0, 198, 255, .2), transparent 10%), linear-gradient(180deg, #0b1723, #0d1b2a)
 }

 #mnf__scope_8c3 .kbd-btn[aria-pressed="true"] {
     border-color: var(--accent);
     background: radial-gradient(550px 500px at 60% 1%, rgba(0, 198, 255, .2), transparent 10%), linear-gradient(180deg, #0b1723, #0d1b2a)
 }

 #mnf__scope_8c3 .kbd-btn:focus-visible {
     outline: 2px solid #89f4ed;
     outline-offset: 2px
 }

 #mnf__scope_8c3 .kbd-pop {
     display: none;
     margin-top: 8px;
     padding: 4px;
     border-radius: 8px;
     border: 1px solid rgba(0, 198, 255, .22);
     background: linear-gradient(180deg, #0c1524, #0a1320);
     color: #dbe7ff;
     box-shadow: var(--shadow)
 }

 #mnf__scope_8c3 .kbd-pop.show {
     display: block
 }

 #mnf__scope_8c3 .info-tip {
     position: relative;
     display: inline-flex;
     margin-left: 8px
 }

 #mnf__scope_8c3 .tip-panel {
     position: absolute;
     right: 0;
     top: calc(100% + 8px);
     min-width: 260px;
     max-width: min(78vw, 420px);
     max-height: 240px;
     overflow: auto;
     padding: 12px 14px;
     border-radius: 10px;
     z-index: 160;
     border: 1px solid rgba(0, 198, 255, .22);
     background: linear-gradient(180deg, #0c1524, #0a1320);
     color: #dbe7ff;
     box-shadow: var(--shadow);
     opacity: 0;
     transform: translateY(-6px) scale(.98);
     filter: blur(1px);
     pointer-events: none;
     transition: opacity .16s ease, transform .16s ease, filter .16s ease
 }

 #mnf__scope_8c3 .info-tip.open .tip-panel,
 #mnf__scope_8c3 .info-tip:hover .tip-panel {
     opacity: 1;
     transform: translateY(0) scale(1);
     filter: blur(0);
     pointer-events: auto
 }

 @media (max-width:992px) {
     #mnf__scope_8c3 .info-tip {
         position: static
     }

     #mnf__scope_8c3 .tip-panel {
         position: fixed;
         left: 12px;
         right: 12px;
         top: auto;
         bottom: 12px;
         max-width: none;
         max-height: 50vh;
         transform: none;
         opacity: 0;
         pointer-events: none;
         z-index: 1000
     }

     #mnf__scope_8c3 .info-tip.open .tip-panel {
         opacity: 1;
         pointer-events: auto
     }

     #mnf__scope_8c3 .mobile-select {
         padding: 0 26px
     }
 }

 #mnf__scope_8c3 #mnf-prompt.hidden~.kbd-btn {
     display: none !important
 }

 .supported-lang {
     opacity: .6
 }

 #mnf__scope_8c3 #mnf-step2 .option-text {
     flex: 1 1 auto;
     width: 100%
 }

 #mnf__scope_8c3 #mnf-step2 .option-editor {
     display: block;
     width: 100%;
     box-sizing: border-box;
     min-height: 120px;
     resize: vertical;
     border: 0;
     outline: none;
     background: transparent;
     color: #e6f0ff;
     font: inherit;
     line-height: 1.55
 }

 #mnf__scope_8c3 #mnf-step2 .option-card {
     position: relative
 }

 #mnf__scope_8c3 #mnf-step2 .option-card .option-actions {
     position: absolute;
     bottom: 10px;
     right: 10px;
     display: none;
     gap: 8px
 }

 #mnf__scope_8c3 #mnf-step2 .option-card:hover .option-actions,
 #mnf__scope_8c3 #mnf-step2 .option-card.editing .option-actions {
     display: flex
 }

 #mnf__scope_8c3 #mnf-step2 .opt-btn {
     border: 1px solid rgba(0, 198, 255, .35);
     background: var(--accent);
     color: #000000;
     padding: 4px 8px;
     border-radius: 6px;
     cursor: pointer;
     line-height: 1
 }

 #mnf__scope_8c3 #mnf-step2 .opt-btn:hover {
     border-color: rgba(0, 198, 255, .6)
 }

 #mnf__scope_8c3 .preview-wrap {
     position: relative
 }

 #mnf__scope_8c3 .right-loading {
     position: absolute;
     inset: 0;
     display: none;
     align-items: center;
     justify-content: center;
     backdrop-filter: blur(6px);
     background: rgba(6, 18, 26, .42);
     z-index: 120
 }

 #mnf__scope_8c3 .right-loading.show {
     display: flex
 }

 #mnf__scope_8c3 .right-loading__card {
     display: flex;
     align-items: center;
     gap: 14px;
     padding: 14px 16px;
     border-radius: 12px;
     border: 1px solid rgba(0, 198, 255, .25);
     background: linear-gradient(180deg, #0c1524, #0a1320);
     box-shadow: var(--shadow)
 }

 #mnf__scope_8c3 .right-loading__text {
     color: #dbe7ff;
     font-weight: 700;
     letter-spacing: .2px
 }

 #mnf__scope_8c3 .right-loading__spinner {
     width: 22px;
     height: 22px;
     border-radius: 50%;
     border: 3px solid rgba(0, 198, 255, .25);
     border-top-color: var(--accent);
     animation: mnf-spin .8s linear infinite
 }

 @keyframes mnf-spin {
     to {
         transform: rotate(360deg)
     }
 }

 #mnf__scope_8c3 * {
     scrollbar-width: thin;
     scrollbar-color: rgba(0, 198, 255, .65) rgba(18, 35, 48, .55)
 }

 #mnf__scope_8c3 textarea,
 #mnf__scope_8c3 .paper,
 #mnf__scope_8c3 .select-menu,
 #mnf__scope_8c3 .tip-panel,
 #mnf__scope_8c3 .kbd-pop {
     scrollbar-color: rgba(0, 198, 255, .8) rgba(12, 25, 38, .55)
 }

 #mnf__scope_8c3::-webkit-scrollbar {
     width: 10px;
     height: 10px
 }

 #mnf__scope_8c3::-webkit-scrollbar-track {
     background: linear-gradient(180deg, #0c1524, #0a1320);
     border-radius: 10px
 }

 #mnf__scope_8c3::-webkit-scrollbar-thumb {
     border-radius: 10px;
     background: linear-gradient(180deg, rgba(0, 198, 255, .95), rgba(109, 216, 210, .85));
     border: 2px solid rgba(7, 19, 24, .6);
     box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12)
 }

 #mnf__scope_8c3::-webkit-scrollbar-thumb:hover {
     background: linear-gradient(180deg, rgba(0, 198, 255, 1), rgba(109, 216, 210, .95))
 }

 #mnf__scope_8c3::-webkit-scrollbar-thumb:active {
     background: linear-gradient(180deg, rgba(0, 198, 255, 1), rgba(72, 200, 191, 1))
 }

 #mnf__scope_8c3::-webkit-scrollbar-corner {
     background: transparent
 }

 @media (max-width:992px) {
     #mnf__scope_8c3::-webkit-scrollbar {
         width: 8px;
         height: 8px
     }

     #mnf__scope_8c3 * {
         scrollbar-width: thin
     }

     #mnf__scope_8c3 .back-btn {
         top: 34px
     }

     #mnf__scope_8c3 .back-btn svg {
         fill: #fff;
         font-size: 14px !important
     }
 }

 #mnf__scope_8c3 .back-btn {
     display: flex
 }

 #mnf__scope_8c3 .back-btn svg {
     fill: #fff;
     font-size: 24px
 }

 .keyboard-container {
     width: 100%;
     height: fit-content;
     background: transparent
 }

 .toolbar {
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin-bottom: 10px;
     background: transparent;
     padding: 4px;
     border-radius: 8px
 }

 .keyboard-container select,
 .keyboard-container button {
     padding: 4px 12px;
     font-size: 13px;
     border-radius: 4px;
     border: 1px solid #616161
 }

 .keyboard-container select {
     background-color: transparent;
     color: #fff;
     border: none
 }

 .keyboard-container select option {
     background-color: var(--panel);
     color: #fff
 }

 #text-input {
     width: 100%;
     height: 80px;
     margin-bottom: 15px;
     font-size: 16px;
     padding: 10px;
     resize: none
 }

 #keyboard {
     display: flex;
     flex-direction: column;
     gap: 6px;
     background-color: transparent
 }

 #language-select {
     border: 1px solid #252525;
     outline: none;
     cursor: pointer
 }

 #language-select:focus {
     border: 1px solid #252525;
     outline: none
 }

 .keyboard-row {
     display: flex;
     gap: 5px;
     flex-wrap: nowrap
 }

 .key {
     color: #fff;
     padding: 4px;
     background-color: transparent;
     border-radius: 4px;
     text-align: center;
     cursor: pointer;
     user-select: none;
     font-size: 14px;
     border: 1px solid #ddd;
     flex: 1;
     min-width: fit-content;
     user-select: none
 }

 .key.wide {
     min-width: fit-content
 }

 .key.space {
     flex: 1
 }

 .key[data-original=".com"],
 .key[data-original="@"] {
     max-width: 100px
 }

 #clear-button {
     width: 100px !important;
     margin-top: 0 !important;
     padding: 8px 16px !important
 }

 @media (max-width:550px) {
     .keyboard-row {
         gap: 2px
     }

     .key {
         font-size: 10px;
         padding: 2px
     }
 }