.xt-lightbox{position:fixed;z-index:300;top:0;right:0;bottom:0;left:0;background:#0a0a09db;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#f2f2ef;font-family:var(--xt-font-ui)}.xt-lightbox-stage{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;overflow:hidden;cursor:zoom-out;touch-action:none}.xt-lightbox-image{max-width:none;border-radius:var(--xt-radius-sm);box-shadow:0 24px 64px #0000007f;transform-origin:center;cursor:zoom-in;-webkit-user-select:none;user-select:none;view-transition-name:xt-lightbox-image}.xt-lightbox-image.is-loading{opacity:0}.xt-lightbox-image.is-animated{transition:transform var(--xt-dur-slow) var(--xt-ease-out)}.xt-lightbox-image.is-pixelated{image-rendering:pixelated;border-radius:0}.xt-lightbox-stage.is-zoomed .xt-lightbox-image{cursor:grab}.xt-lightbox-stage.is-dragging .xt-lightbox-image{cursor:grabbing}.xt-lightbox-bar{position:absolute;top:12px;right:12px;left:12px;display:flex;align-items:center;gap:4px;pointer-events:none}.xt-lightbox-bar>*{pointer-events:auto}.xt-lightbox-spacer{flex:1;pointer-events:none}.xt-lightbox-count,.xt-lightbox-caption{padding:6px 10px;border-radius:var(--xt-radius-pill);background:#ffffff1a;font-size:12px;font-variant-numeric:tabular-nums}.xt-lightbox-caption{max-width:50vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.xt-lightbox button{display:grid;place-items:center;min-width:34px;height:34px;padding:0 8px;border:0;border-radius:var(--xt-radius-md);background:#ffffff1a;color:inherit;font-size:12px;font-variant-numeric:tabular-nums;cursor:pointer;transition:background-color var(--xt-dur-fast) var(--xt-ease-out),transform var(--xt-dur-fast) var(--xt-ease-press)}.xt-lightbox button:hover:not(:disabled){background:#ffffff2e}.xt-lightbox button:active:not(:disabled){transform:scale(.94)}.xt-lightbox button:disabled{opacity:.4;cursor:default}.xt-lightbox-zoom{min-width:56px}.xt-lightbox-nav{position:absolute;top:50%;width:40px;height:40px!important;border-radius:var(--xt-radius-pill)!important;transform:translateY(-50%)}.xt-lightbox-nav:active:not(:disabled){transform:translateY(-50%) scale(.94)!important}.xt-lightbox-nav.is-prev{left:16px}.xt-lightbox-nav.is-next{right:16px}::view-transition-group(xt-lightbox-image){animation-duration:var(--xt-spring-snappy-dur);animation-timing-function:var(--xt-spring-snappy)}.xt-tooltip{position:fixed;z-index:400;top:0;left:0;max-width:280px;padding:5px 8px;border-radius:var(--xt-radius-sm);background:var(--xt-action);color:var(--xt-action-text);box-shadow:var(--xt-shadow-md);font:400 12px/1.4 var(--xt-font-ui);white-space:pre-line;overflow-wrap:anywhere;pointer-events:none}.xt-tooltip-enter-active{transition:opacity .12s var(--xt-ease-out),translate .16s var(--xt-ease-out)}.xt-tooltip-leave-active{transition:opacity 80ms var(--xt-ease-in)}.xt-tooltip-enter-from,.xt-tooltip-leave-to{opacity:0}.xt-tooltip.is-top.xt-tooltip-enter-from{translate:0 3px}.xt-tooltip.is-bottom.xt-tooltip-enter-from{translate:0 -3px}.xt-update-bar[data-v-2a4e4e8e]{position:fixed;top:12px;left:50%;z-index:1000;display:flex;align-items:center;gap:12px;max-width:calc(100vw - 24px);padding:8px 8px 8px 14px;transform:translate(-50%);border-radius:var(--xt-radius-lg);background:var(--xt-warning-soft);color:var(--xt-warning);box-shadow:var(--xt-shadow-md);font-size:13px}.xt-update-bar__action[data-v-2a4e4e8e]{display:inline-flex;flex-shrink:0;align-items:center;gap:6px;padding:5px 10px;border:0;border-radius:var(--xt-radius-sm);background:var(--xt-action);color:var(--xt-action-text);font:inherit;cursor:pointer}.xt-update-bar__action[data-v-2a4e4e8e]:hover{background:var(--xt-action-hover)}:root{--xt-font-sans: Inter, "PingFang SC", "Microsoft YaHei UI", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, sans-serif;--xt-font-ui: "SF Pro Text", "Segoe UI Variable Text", "Segoe UI", "PingFang SC", "Microsoft YaHei UI", "Microsoft YaHei", sans-serif;--xt-font-mono: ui-monospace, SFMono-Regular, Menlo, "Cascadia Mono", Consolas, "PingFang SC", "Microsoft YaHei UI", "Microsoft YaHei", monospace;--xt-surface-0: #f5f5f2;--xt-surface-1: #fafaf8;--xt-surface-2: #ffffff;--xt-surface-3: #ffffff;--xt-surface-popover: #ffffff;--xt-surface-sunken: #efefeb;--xt-alpha-1: rgb(25 25 22 / 5%);--xt-alpha-2: rgb(25 25 22 / 10%);--xt-alpha-3: rgb(25 25 22 / 18%);--xt-alpha-4: rgb(25 25 22 / 32%);--xt-border: var(--xt-alpha-2);--xt-border-strong: var(--xt-alpha-3);--xt-hairline: 1px;--xt-text-1: #1a1a17;--xt-text-2: #5b5b55;--xt-text-3: #8c8b84;--xt-text-inverse: #ffffff;--xt-brand: #d8552d;--xt-brand-hover: #c2461f;--xt-brand-soft: #fbefe9;--xt-action: #22221f;--xt-action-hover: #0f0f0d;--xt-action-text: #ffffff;--xt-user-bubble: #f0efea;--xt-success: #1f7a3d;--xt-success-soft: #e3f4e7;--xt-warning: #9a6700;--xt-warning-soft: #fdf4d8;--xt-danger: #cf2d2d;--xt-danger-hover: #b22020;--xt-danger-soft: #fdeceb;--xt-info: #2563c9;--xt-info-soft: #e5eefc;--xt-code-surface: #1d1e1b;--xt-code-border: #34352f;--xt-code-text: #ecece7;--xt-code-muted: #a2a29a;--xt-checker-light: #ffffff;--xt-checker-dark: #c8c8c8;--xt-radius-xs: 4px;--xt-radius-sm: 6px;--xt-radius-md: 8px;--xt-radius-panel: 10px;--xt-radius-lg: 12px;--xt-radius-xl: 16px;--xt-radius-bubble: 18px;--xt-radius-composer: 20px;--xt-radius-pill: 999px;--xt-ring: 0 0 0 var(--xt-hairline) var(--xt-border);--xt-shadow-sm: 0 1px 2px rgb(0 0 0 / 5%), 0 2px 8px rgb(0 0 0 / 6%);--xt-shadow-md: 0 2px 4px rgb(0 0 0 / 5%), 0 6px 16px rgb(0 0 0 / 8%);--xt-shadow-lg: 0 4px 8px rgb(0 0 0 / 6%), 0 12px 28px -2px rgb(0 0 0 / 10%);--xt-shadow-popover: 0 0 0 var(--xt-hairline) var(--xt-border), 0 8px 24px rgb(0 0 0 / 12%), 0 2px 6px rgb(0 0 0 / 7%);--xt-shadow-dialog: 0 0 0 var(--xt-hairline) var(--xt-border), 0 24px 64px -8px rgb(0 0 0 / 22%), 0 4px 12px rgb(0 0 0 / 8%);--xt-shadow-panel: 0 0 0 var(--xt-hairline) var(--xt-border), var(--xt-shadow-sm);--xt-shadow-panel-hover: 0 0 0 var(--xt-hairline) var(--xt-border-strong), 0 4px 16px -2px rgb(0 0 0 / 9%);--xt-shadow-composer: 0 4px 20px rgb(0 0 0 / 4%), inset 0 0 0 1px var(--xt-border);--xt-shadow-composer-hover: 0 4px 24px rgb(0 0 0 / 6%), inset 0 0 0 1px var(--xt-border-strong);--xt-shadow-composer-focus: 0 4px 24px rgb(0 0 0 / 8%), inset 0 0 0 1px var(--xt-border-strong), 0 0 0 1px var(--xt-border-strong);--xt-focus-ring: 0 0 0 1.5px var(--xt-brand), 0 0 6px 1px rgb(216 85 45 / 25%);--xt-overlay: rgb(20 20 18 / 32%);--xt-dur-micro: 70ms;--xt-dur-fast: .12s;--xt-dur-base: .2s;--xt-dur-slow: .3s;--xt-ease-out: cubic-bezier(.16, 1, .3, 1);--xt-ease-overshoot: cubic-bezier(.34, 1.3, .64, 1);--xt-ease-decel: cubic-bezier(.165, .84, .44, 1);--xt-ease-press: cubic-bezier(.32, .72, 0, 1);--xt-ease-in: cubic-bezier(.4, 0, 1, 1);--xt-spring-bouncy: linear(0, .071, .235, .434, .628, .794, .922, 1.009, 1.061, 1.084, 1.087, 1.078, 1.062, 1.044, 1.028, 1.014, 1.004, .997, .994, .992, .993, .994, .995, .997, 1);--xt-spring-bouncy-dur: .4s;--xt-spring-snappy: linear(0, .046, .154, .289, .43, .562, .678, .774, .851, .909, .951, .981, 1, 1.011, 1.017, 1.019, 1.019, 1.017, 1.014, 1.012, 1.009, 1.007, 1.005, 1.003, 1);--xt-spring-snappy-dur: .44s;--xt-spring-gentle: linear(0, .11, .361, .649, .899, 1.076, 1.171, 1.195, 1.17, 1.119, 1.064, 1.016, .983, .966, .962, .968, .978, .989, .998, 1.004, 1.007, 1.007, 1.006, 1.004, 1);--xt-spring-gentle-dur: .63s;--xt-spring-heavy: linear(0, .213, .393, .532, .639, .721, .785, .834, .872, .901, .924, .941, .955, .965, .973, .979, .984, .988, .99, .993, .994, .996, .997, .997, 1);--xt-spring-heavy-dur: .4s;--xt-scroll-fade-size: 28px;--xt-ink: var(--xt-text-1);--xt-paper: var(--xt-surface-0);--xt-surface: var(--xt-surface-1);--xt-panel: var(--xt-surface-sunken);--xt-muted: var(--xt-text-2);--xt-line: var(--xt-border-strong);--xt-accent: var(--xt-brand);--xt-preview-bg: #11120f;--xt-preview-fg: #f4f4ee;--xt-preview-muted: #b7bbb0;--xt-preview-line: #73786e}@media(min-resolution:2dppx){:root{--xt-hairline: .5px}}[data-mode=dark],.studio-shell[data-theme=codex-night]{--xt-surface-0: #0e0e0d;--xt-surface-1: #151514;--xt-surface-2: #1b1b1a;--xt-surface-3: #21211f;--xt-surface-popover: #242422;--xt-surface-sunken: #0a0a09;--xt-alpha-1: rgb(255 255 255 / 5%);--xt-alpha-2: rgb(255 255 255 / 9%);--xt-alpha-3: rgb(255 255 255 / 17%);--xt-alpha-4: rgb(255 255 255 / 30%);--xt-text-1: #f2f2ef;--xt-text-2: #a6a6a0;--xt-text-3: #6e6e69;--xt-text-inverse: #141413;--xt-brand: #e2683f;--xt-brand-hover: #ec7c55;--xt-brand-soft: rgb(226 104 63 / 15%);--xt-action: #ededea;--xt-action-hover: #ffffff;--xt-action-text: #141413;--xt-user-bubble: #2a2a28;--xt-success: #4cc06f;--xt-success-soft: rgb(76 192 111 / 14%);--xt-warning: #e0b043;--xt-warning-soft: rgb(224 176 67 / 14%);--xt-danger: #f06a6a;--xt-danger-hover: #f58585;--xt-danger-soft: rgb(240 106 106 / 14%);--xt-info: #6ea2f5;--xt-info-soft: rgb(110 162 245 / 14%);--xt-code-surface: #111110;--xt-code-border: #2c2c2a;--xt-shadow-sm: 0 1px 2px rgb(0 0 0 / 40%), 0 2px 8px rgb(0 0 0 / 40%);--xt-shadow-md: 0 2px 4px rgb(0 0 0 / 40%), 0 6px 16px rgb(0 0 0 / 40%);--xt-shadow-lg: 0 4px 8px rgb(0 0 0 / 50%), 0 16px 36px -2px rgb(0 0 0 / 45%);--xt-shadow-popover: inset 0 0 0 1px rgb(255 255 255 / 10%), 0 8px 28px rgb(0 0 0 / 65%), 0 2px 8px rgb(0 0 0 / 45%);--xt-shadow-dialog: inset 0 0 0 1px rgb(255 255 255 / 10%), 0 24px 64px -8px rgb(0 0 0 / 75%), 0 4px 12px rgb(0 0 0 / 45%);--xt-shadow-panel-hover: 0 0 0 var(--xt-hairline) var(--xt-border-strong), 0 6px 20px rgb(0 0 0 / 60%);--xt-shadow-composer: 0 4px 20px rgb(0 0 0 / 40%), inset 0 0 0 1px var(--xt-border);--xt-shadow-composer-hover: 0 4px 24px rgb(0 0 0 / 55%), inset 0 0 0 1px var(--xt-border-strong);--xt-shadow-composer-focus: 0 4px 24px rgb(0 0 0 / 65%), inset 0 0 0 1px rgb(255 255 255 / 22%), 0 0 0 1px rgb(255 255 255 / 22%);--xt-focus-ring: 0 0 0 1.5px var(--xt-brand), 0 0 8px 2px rgb(226 104 63 / 35%);--xt-overlay: rgb(0 0 0 / 55%);color-scheme:dark}[data-mode=dark] strong,[data-mode=dark] b,[data-mode=dark] h1,[data-mode=dark] h2,[data-mode=dark] h3{-webkit-font-smoothing:antialiased}:root,[data-mode],.studio-shell{--text-primary: var(--xt-text-1);--text-secondary: var(--xt-text-2);--text-tertiary: var(--xt-text-3);--text-inverse: var(--xt-action-text);--surface-app: var(--xt-surface-0);--surface-panel: var(--xt-surface-1);--surface-raised: var(--xt-surface-2);--surface-popover: var(--xt-surface-popover);--surface-soft: var(--xt-alpha-1);--surface-user: var(--xt-user-bubble);--border-subtle: var(--xt-border);--border-strong: var(--xt-border-strong);--shadow: rgb(0 0 0 / 6%);--accent: var(--xt-action);--accent-hover: var(--xt-action-hover);--accent-soft: var(--xt-alpha-2);--brand: var(--xt-brand);--brand-soft: var(--xt-brand-soft);--focus-ring: rgb(216 85 45 / 22%);--canvas: var(--xt-surface-2);--canvas-dot: var(--xt-alpha-2);--overlay: var(--xt-overlay);--status-success: var(--xt-success);--status-success-strong: var(--xt-success);--status-success-soft: var(--xt-success-soft);--status-warning: var(--xt-warning);--status-warning-strong: var(--xt-warning);--status-warning-soft: var(--xt-warning-soft);--status-danger: var(--xt-danger);--status-danger-strong: var(--xt-danger-hover);--status-danger-soft: var(--xt-danger-soft);--status-info: var(--xt-info);--status-info-soft: var(--xt-info-soft);--thinking-low: #68717d;--thinking-mid: #4d6f9e;--thinking-high: #7256a8;--particle-light: rgb(226 245 255 / 92%);--code-surface: var(--xt-code-surface);--code-border: var(--xt-code-border);--code-text: var(--xt-code-text);--code-muted: var(--xt-code-muted);--ink: var(--text-primary);--paper: var(--surface-app);--panel: var(--surface-panel);--line: var(--border-subtle);--muted: var(--text-secondary);--orange: var(--xt-brand);--focus: var(--xt-brand);--accent-weak: var(--accent-soft);--user-surface: var(--surface-user)}[data-mode=dark],.studio-shell[data-theme=codex-night]{--shadow: rgb(0 0 0 / 40%);--focus-ring: rgb(226 104 63 / 30%);--thinking-low: #8a93a0;--thinking-mid: #6d8fc4;--thinking-high: #9a7ad4}.studio-shell{font-family:var(--xt-font-ui)}@keyframes xt-grapheme-reveal{0%{opacity:0;filter:blur(2px)}to{opacity:1;filter:blur(0)}}@keyframes xt-fade-in{0%{opacity:0}}@keyframes xt-fade-up{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes xt-bubble-in{0%{opacity:0;transform:translateY(8px) scale(.94)}to{opacity:1;transform:none}}@keyframes xt-grow-in{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:none}}@keyframes xt-dot-pulse{0%,80%,to{opacity:.25;transform:scale(.8)}40%{opacity:1;transform:scale(1)}}@keyframes xt-breathe{0%,to{opacity:.55;transform:scale(.92)}50%{opacity:1;transform:scale(1)}}@keyframes xt-skeleton{0%{background-position:150% 0}to{background-position:-50% 0}}@keyframes xt-saved-decay{0%{opacity:0;transform:scale(.6)}12%{opacity:1;transform:scale(1.08)}20%{transform:scale(1)}75%{opacity:1}to{opacity:0}}@keyframes xt-shimmer-text{0%{background-position:100% 0}to{background-position:-100% 0}}@keyframes xt-spin{to{transform:rotate(360deg)}}.xt-grapheme{animation:xt-grapheme-reveal .24s var(--xt-ease-out) backwards}.xt-skeleton{border-radius:var(--xt-radius-sm);background:linear-gradient(90deg,var(--xt-alpha-1) 25%,var(--xt-alpha-2) 50%,var(--xt-alpha-1) 75%);background-size:200% 100%;animation:xt-skeleton 1.4s linear infinite}.xt-shimmer-text{color:transparent;background:linear-gradient(90deg,var(--xt-text-3) 0%,var(--xt-text-3) 40%,var(--xt-text-1) 50%,var(--xt-text-3) 60%,var(--xt-text-3) 100%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;animation:xt-shimmer-text 2s linear infinite}.xt-press{transition:transform var(--xt-dur-fast) var(--xt-ease-press),background-color var(--xt-dur-fast) var(--xt-ease-out),color var(--xt-dur-fast) var(--xt-ease-out),box-shadow var(--xt-dur-base) var(--xt-ease-out)}.xt-press:active:not(:disabled){transform:scale(.96)}.xt-collapse{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--xt-dur-slow) var(--xt-ease-out),opacity var(--xt-dur-base) var(--xt-ease-out);opacity:0}.xt-collapse>*{min-height:0;overflow:hidden}.xt-collapse.is-open{grid-template-rows:1fr;opacity:1}.xt-pop-enter-active{transition:opacity .15s var(--xt-ease-out),transform var(--xt-spring-snappy-dur) var(--xt-spring-snappy)}.xt-pop-leave-active{transition:opacity var(--xt-dur-fast) var(--xt-ease-in),transform var(--xt-dur-fast) var(--xt-ease-in)}.xt-pop-enter-from,.xt-pop-leave-to{opacity:0;transform:translateY(4px) scale(.95)}.xt-dialog-enter-active{transition:opacity var(--xt-dur-base) var(--xt-ease-out)}.xt-dialog-leave-active{transition:opacity .15s var(--xt-ease-in)}.xt-dialog-enter-from,.xt-dialog-leave-to{opacity:0}.xt-dialog-enter-active .xt-dialog-card{transition:transform var(--xt-spring-snappy-dur) var(--xt-spring-snappy),opacity var(--xt-dur-base) var(--xt-ease-out)}.xt-dialog-leave-active .xt-dialog-card{transition:transform .15s var(--xt-ease-in),opacity .15s var(--xt-ease-in)}.xt-dialog-enter-from .xt-dialog-card,.xt-dialog-leave-to .xt-dialog-card{opacity:0;transform:translateY(8px) scale(.96)}.xt-fade-enter-active{transition:opacity var(--xt-dur-base) var(--xt-ease-out)}.xt-fade-leave-active{transition:opacity var(--xt-dur-fast) var(--xt-ease-in)}.xt-fade-enter-from,.xt-fade-leave-to{opacity:0}.xt-fade-up-enter-active{transition:opacity var(--xt-dur-slow) var(--xt-ease-out),transform var(--xt-dur-slow) var(--xt-ease-out)}.xt-fade-up-leave-active{transition:opacity var(--xt-dur-fast) var(--xt-ease-in),transform var(--xt-dur-fast) var(--xt-ease-in)}.xt-fade-up-enter-from{opacity:0;transform:translateY(12px)}.xt-fade-up-leave-to{opacity:0;transform:translateY(4px)}.xt-sheet-enter-active{transition:transform var(--xt-spring-heavy-dur) var(--xt-spring-heavy),opacity var(--xt-dur-base) var(--xt-ease-out)}.xt-sheet-leave-active{transition:transform var(--xt-dur-base) var(--xt-ease-in),opacity var(--xt-dur-base) var(--xt-ease-in)}.xt-sheet-enter-from,.xt-sheet-leave-to{opacity:0;transform:translate(24px)}.xt-list-move{transition:transform var(--xt-dur-slow) var(--xt-ease-out)}.xt-list-enter-active{transition:opacity var(--xt-dur-base) var(--xt-ease-out),transform var(--xt-dur-slow) var(--xt-ease-out)}.xt-list-leave-active{transition:opacity var(--xt-dur-fast) var(--xt-ease-in);position:absolute}.xt-list-enter-from{opacity:0;transform:translateY(8px)}.xt-list-leave-to{opacity:0}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important;scroll-behavior:auto!important}.xt-grapheme{animation:none}}.xt-scroll-fade{--fade-top: 0px;--fade-bottom: 0px;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#0000000d calc(var(--fade-top) * .15),#00000026 calc(var(--fade-top) * .3),#0000004d calc(var(--fade-top) * .45),#00000080 calc(var(--fade-top) * .6),#000000b3 calc(var(--fade-top) * .75),#000000d9 calc(var(--fade-top) * .87),#000 var(--fade-top),#000 calc(100% - var(--fade-bottom)),#000000d9 calc(100% - var(--fade-bottom) * .87),#000000b3 calc(100% - var(--fade-bottom) * .75),#00000080 calc(100% - var(--fade-bottom) * .6),#0000004d calc(100% - var(--fade-bottom) * .45),#00000026 calc(100% - var(--fade-bottom) * .3),#0000000d calc(100% - var(--fade-bottom) * .15),transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#0000000d calc(var(--fade-top) * .15),#00000026 calc(var(--fade-top) * .3),#0000004d calc(var(--fade-top) * .45),#00000080 calc(var(--fade-top) * .6),#000000b3 calc(var(--fade-top) * .75),#000000d9 calc(var(--fade-top) * .87),#000 var(--fade-top),#000 calc(100% - var(--fade-bottom)),#000000d9 calc(100% - var(--fade-bottom) * .87),#000000b3 calc(100% - var(--fade-bottom) * .75),#00000080 calc(100% - var(--fade-bottom) * .6),#0000004d calc(100% - var(--fade-bottom) * .45),#00000026 calc(100% - var(--fade-bottom) * .3),#0000000d calc(100% - var(--fade-bottom) * .15),transparent 100%)}:root{color:var(--xt-text-1);background:var(--xt-surface-0);font-family:var(--xt-font-sans);-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body,#app{min-width:320px;min-height:100%;margin:0}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,a:focus-visible{outline:none;box-shadow:var(--xt-focus-ring)}::selection{background:#d8552d38}.ink-device{display:block;container-type:inline-size;width:100%}.ink-device-body,.ink-device-screen{display:block}.ink-device-body{--u:calc(100cqw / 287);position:relative;padding:calc(var(--u) * 24) calc(var(--u) * 30) calc(var(--u) * 59);filter:drop-shadow(0 14px 22px #1616162e)}.ink-device-body:before{position:absolute;inset:calc(var(--u) * 2);border-radius:calc(var(--u) * 27);background:#11120f;content:""}.ink-device-body:after{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;background:url(/device/x4-device.svg) top/100% auto no-repeat;content:"";pointer-events:none}.ink-device-screen{position:relative;z-index:1;aspect-ratio:480/800;overflow:hidden;background:#f5f4ef}.ink-device-screen img{display:block;width:100%;height:auto;mix-blend-mode:multiply}.ink-device.is-crop .ink-device-body{padding-bottom:0;-webkit-mask-image:linear-gradient(#000 calc(100% - 28px),transparent);mask-image:linear-gradient(#000 calc(100% - 28px),transparent)}.ink-device.is-crop .ink-device-body:before{bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.ink-device.is-crop .ink-device-screen{aspect-ratio:auto;padding:calc(var(--u) * 12) 0 calc(var(--u) * 22)}