/* Shared product presentation. The simulator chrome lives in preview.css. */
.mm-screen{--mm-bg:var(--as-bg);--mm-surface:var(--as-bg-grouped-2);--mm-ink:var(--as-label);--mm-secondary:color-mix(in srgb,var(--as-label) 66%,transparent);--mm-line:color-mix(in srgb,var(--as-separator-opaque) 35%,transparent);--mm-accent:light-dark(#0066cc,#64aaff);--mm-soft:color-mix(in srgb,var(--as-blue) 8%,var(--as-bg-grouped-2));--mm-danger:#b32632;position:relative;height:100%;overflow:hidden;background:var(--mm-bg);color:var(--mm-ink);font:17px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;container-type:inline-size;color-scheme:light}
.mm-screen *{box-sizing:border-box}.mm-screen button,.mm-screen input,.mm-screen select,.mm-screen textarea{font:inherit;color:inherit}.mm-screen button{cursor:pointer;border:0;background:none;min-height:44px;min-width:44px;padding:8px 12px;border-radius:22px;touch-action:manipulation}.mm-screen button:active{transform:scale(.97)}.mm-screen button:disabled{opacity:.45;cursor:default}.mm-screen :focus-visible{outline:2px solid var(--mm-accent);outline-offset:3px}.mm-screen h1{font-size:calc(34px * var(--mm-text-scale));line-height:1.22;font-weight:700;letter-spacing:0;margin:4px 0 8px}.mm-screen h2{font-size:calc(20px * var(--mm-text-scale));line-height:1.35;margin:28px 0 12px;font-weight:650}.mm-screen h3{font-size:calc(17px * var(--mm-text-scale));margin:0;font-weight:600}.mm-screen p{margin:8px 0 16px}.mm-screen small,.mm-footnote{font-size:calc(13px * var(--mm-text-scale));line-height:1.45;color:var(--mm-secondary)}.mm-screen .mm-muted{color:var(--mm-secondary);font-size:calc(15px * var(--mm-text-scale));line-height:1.55}.mm-screen .mm-kicker{font-size:calc(13px * var(--mm-text-scale));font-weight:600;color:var(--mm-secondary);margin:0 0 4px}.mm-icon{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;vertical-align:middle}
.mm-topbar{position:absolute;inset-block-start:0;inset-inline:0;height:52px;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:0 12px;pointer-events:none}.mm-topbar button{pointer-events:auto;display:inline-flex;align-items:center;gap:0;padding:8px;color:var(--mm-ink)}.mm-topbar .mm-top-title{font-size:calc(17px * var(--mm-text-scale));font-weight:600;visibility:hidden}.mm-screen.is-scrolled .mm-top-title{visibility:visible}.mm-screen .mm-topbar.as-scroll-edge::before{background:linear-gradient(var(--mm-bg),transparent);height:72px;opacity:.96}.mm-topbar .mm-back{max-width:45%;font-size:calc(15px * var(--mm-text-scale))}.mm-topbar .mm-back .mm-icon{width:18px}.mm-content{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;padding:56px 20px 118px;scrollbar-width:none}.mm-content::-webkit-scrollbar{display:none}.mm-intro{color:var(--mm-secondary);font-size:calc(15px * var(--mm-text-scale));line-height:1.6;margin-bottom:24px!important}.mm-section-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-top:28px}.mm-section-head h2{margin:0 0 12px}.mm-section-head button{font-size:calc(13px * var(--mm-text-scale));padding:0;min-height:44px;color:var(--mm-secondary)}
.mm-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.mm-category{display:block;text-align:start!important;background:var(--mm-surface)!important;border-radius:24px!important;padding:16px!important;min-height:156px!important;overflow:hidden}.mm-category b{display:block;font-size:calc(17px * var(--mm-text-scale));margin-top:12px}.mm-category small{display:block;margin-top:3px}.mm-mini-widget{background:#f0edff;border-radius:14px;padding:12px;height:70px;color:#23232a;display:flex;align-items:center;gap:12px}.mm-mini-widget .mm-mini-date{font-size:calc(30px * var(--mm-text-scale));font-weight:650;line-height:1}.mm-mini-widget small{font-size:calc(11px * var(--mm-text-scale));color:#65558c}.mm-mini-home{height:70px;background:#eef3ff;border-radius:14px;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:18px 10px}.mm-mini-home img{width:100%;aspect-ratio:1;border-radius:7px;object-fit:cover}.mm-feature{background:var(--mm-surface)!important;width:100%;margin-top:12px;min-height:124px!important;padding:18px!important;border-radius:24px!important;display:flex;justify-content:space-between;align-items:center;text-align:start;gap:16px}.mm-feature h3{font-size:calc(20px * var(--mm-text-scale));margin-bottom:5px}.mm-feature p{font-size:calc(13px * var(--mm-text-scale));color:var(--mm-secondary);margin:0;line-height:1.6}.mm-mini-paper{flex-shrink:0;width:86px;height:92px;transform:rotate(7deg);border-radius:7px;border:1px solid #efcedc;background:#fff2f7;padding:13px 10px;color:#aa4269;box-shadow:0 4px 10px #00000008}.mm-mini-paper .mm-icon{width:15px;height:15px}.mm-mini-paper i{display:block;height:1px;background:#efd8e2;margin-top:12px}.mm-list{border-radius:24px;overflow:hidden;background:var(--mm-surface)}.mm-row{width:100%;border-radius:0!important;display:flex;align-items:center;gap:14px;padding:15px 16px!important;min-height:72px!important;text-align:start}.mm-row+.mm-row{border-top:1px solid var(--mm-line)}.mm-row>span:nth-of-type(2){flex:1;min-width:0}.mm-row b{display:block;font-size:calc(17px * var(--mm-text-scale));font-weight:550}.mm-row small{display:block;font-size:calc(13px * var(--mm-text-scale));margin-top:3px;line-height:1.5}.mm-row-symbol{width:36px;height:36px;display:grid;place-items:center;border-radius:11px;background:var(--mm-soft);color:var(--mm-accent);flex-shrink:0}.mm-row-symbol img{width:36px;height:36px;object-fit:cover;border-radius:10px}.mm-chevron{width:15px;color:var(--mm-secondary)}.mm-chapter{min-height:102px!important;padding:16px!important;border-radius:22px!important;text-align:start;background:var(--mm-surface)!important}.mm-chapter small{display:block;margin-top:6px}.mm-chapter .mm-icon{margin-bottom:12px;color:var(--mm-accent)}
.mm-bottom{position:absolute;inset-inline:16px;inset-block-end:max(18px,env(safe-area-inset-bottom));display:flex;gap:8px;z-index:20;align-items:center}.mm-bottom .as-glass{--as-glass-radius:32px;--as-glass-sheen:transparent;--as-glass-brightness:1;--as-glass-fill:rgba(255,255,255,.72);color:var(--mm-ink)}.mm-tabs{flex:1;display:flex;padding:4px;gap:0;min-width:0}.mm-tabs button{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:5px 2px;border-radius:28px;min-height:56px;font-size:calc(11px * var(--mm-text-scale));color:var(--mm-secondary)}.mm-tabs button[aria-current=page]{background:var(--mm-soft);color:var(--mm-accent);font-weight:650}.mm-tabs .mm-icon{width:23px;height:23px}.mm-search-tab{width:56px;height:64px;padding:0!important;display:grid;place-items:center}.mm-search-tab[aria-current=page]{--as-glass-fill:var(--mm-soft)}
.mm-btn{display:inline-flex;gap:8px;align-items:center;justify-content:center;background:var(--mm-soft)!important;font-weight:550;font-size:calc(15px * var(--mm-text-scale))!important;min-height:48px!important;padding:10px 18px!important}.mm-btn.primary{background:var(--mm-accent)!important;color:white!important}.mm-btn.danger{color:var(--mm-danger)!important}.mm-btn.wide{width:100%}.mm-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:16px 0}.mm-save-row{display:flex;gap:8px;margin:20px 0 12px}.mm-save-row .primary{flex:1}.mm-text-link{color:var(--mm-accent)!important;font-size:calc(15px * var(--mm-text-scale))!important;padding-inline:4px!important;text-align:start}.mm-preview-card{background:var(--mm-surface);border-radius:24px;overflow:hidden;margin:20px 0 16px}.mm-preview-caption{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 12px;font-size:calc(13px * var(--mm-text-scale))}.mm-preview-caption b{font-weight:550}.mm-preview-caption button{font-size:calc(13px * var(--mm-text-scale));color:var(--mm-secondary);padding:4px 8px}.mm-effect{display:block;width:100%;border:0;height:370px;overflow:hidden;background:var(--mm-bg)}.mm-compare{width:176px;margin:14px auto 18px}.mm-compare.as-segmented{min-height:36px;font-size:calc(13px * var(--mm-text-scale));--as-seg-bg:var(--mm-soft)}.mm-compare .as-segment{font-size:calc(13px * var(--mm-text-scale));min-height:36px;padding:6px 12px}.mm-preview-note{text-align:center;font-size:calc(13px * var(--mm-text-scale));color:var(--mm-secondary)}
.mm-style-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:14px 0}.mm-style-option{padding:6px!important;border-radius:18px!important;text-align:center;border:2px solid transparent!important;min-height:102px!important;background:var(--mm-surface)!important}.mm-style-option[aria-pressed=true]{border-color:var(--mm-accent)!important}.mm-style-option small{display:block;margin-top:6px;font-size:calc(12px * var(--mm-text-scale));color:var(--mm-ink)}.mm-swatch{height:48px;border-radius:11px;background:#f4eeff;padding:8px}.mm-swatch>i{display:block;margin:auto;width:76%;height:100%;background:#ffffffb3;border-radius:7px;border:1px solid #d6cee6}.mm-swatch.note>i{background:#fff0bb;border-radius:1px;border:0}.mm-swatch.text>i{background:repeating-linear-gradient(transparent 0 7px,#655b77 7px 8px);border:0;border-radius:0;width:60%}.mm-swatch.none>i{border:0}.mm-swatch.glass>i{background:#ffffff65;box-shadow:0 2px 6px #25204a15}.mm-swatch.clear>i{background:#ffffff25}.mm-control-group{margin:12px 0 20px;background:var(--mm-surface);border-radius:24px;overflow:hidden}.mm-control{display:block;padding:14px 16px}.mm-control+.mm-control{border-top:1px solid var(--mm-line)}.mm-control-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:calc(15px * var(--mm-text-scale));min-height:30px}.mm-control output{font-size:calc(13px * var(--mm-text-scale));color:var(--mm-secondary);font-variant-numeric:tabular-nums}.mm-control input[type=range]{display:block;width:100%;margin:14px 0 6px;touch-action:pan-y;accent-color:var(--mm-accent)}.mm-control input[type=color]{height:44px;width:48px;padding:5px;border:0;border-radius:10px;background:var(--mm-soft)}.mm-control select,.mm-target select{max-width:62%;font-size:calc(16px * var(--mm-text-scale));border:0;background:transparent;padding:8px 0;text-align:end}.mm-target{display:flex;justify-content:space-between;align-items:center;background:var(--mm-surface);padding:12px 16px;border-radius:20px;margin:20px 0 12px;font-size:calc(15px * var(--mm-text-scale));gap:8px}.mm-screen details{background:var(--mm-surface);border-radius:22px;margin:12px 0}.mm-screen summary{padding:16px;cursor:pointer;font-size:calc(17px * var(--mm-text-scale));font-weight:550;min-height:52px}.mm-screen details>div{padding:0 16px 16px}.mm-code-card{background:var(--mm-surface);border-radius:22px;margin:20px 0;overflow:hidden}.mm-code-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 16px;border-bottom:1px solid var(--mm-line);font-size:calc(13px * var(--mm-text-scale));color:var(--mm-secondary)}.mm-code-head button{font-size:calc(13px * var(--mm-text-scale));background:var(--mm-soft);min-height:44px}.mm-code-card pre{padding:16px;margin:0;font:13px/1.8 ui-monospace,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--mm-ink)}.mm-editor{width:100%;resize:none;overflow:hidden;min-height:240px;border:0;background:var(--mm-surface);border-radius:22px;padding:18px;font:16px/1.65 ui-monospace,Consolas,monospace!important;white-space:pre-wrap;tab-size:2}.mm-editor-label{display:block;margin:20px 0 12px;font-weight:600}.mm-error{border-radius:18px;background:#faeded;padding:16px;color:var(--mm-danger);font-size:calc(15px * var(--mm-text-scale));line-height:1.6;margin:12px 0}.mm-error[hidden],.mm-toast[hidden]{display:none}.mm-search-field{display:flex;gap:10px;align-items:center;background:var(--mm-surface);border-radius:24px;margin:22px 0 24px;padding:0 12px;min-height:52px}.mm-search-field input{width:100%;min-width:0;border:0;background:none;font-size:calc(17px * var(--mm-text-scale));padding:12px 0}.mm-search-field button{padding:0}.mm-search-field:focus-within{outline:2px solid var(--mm-accent);outline-offset:2px}.mm-search-field input:focus-visible{outline:none}.mm-filter{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 20px}.mm-filter button{background:var(--mm-surface);font-size:calc(13px * var(--mm-text-scale));min-height:44px}.mm-filter button[aria-pressed=true]{background:var(--mm-soft);font-weight:600}.mm-count{font-size:calc(13px * var(--mm-text-scale));color:var(--mm-secondary);margin:16px 0 12px}.mm-empty{text-align:center;padding:36px 16px}.mm-empty .mm-icon{width:40px;height:40px;color:var(--mm-secondary)}.mm-pagination{display:flex;gap:8px;margin:28px 0 12px}.mm-pagination button{flex:1;background:var(--mm-surface);font-size:calc(15px * var(--mm-text-scale))}.mm-toast{position:absolute;inset-inline:20px;inset-block-end:100px;z-index:60;background:var(--mm-ink);color:var(--mm-surface);border-radius:18px;padding:12px 16px;font-size:calc(13px * var(--mm-text-scale));box-shadow:0 4px 16px #0001;pointer-events:none}.mm-sheet{position:absolute;inset:auto 12px 18px;max-height:80%;width:calc(100% - 24px);max-width:none;border:0;border-radius:28px;padding:24px;background:var(--mm-surface);color:var(--mm-ink);z-index:41}.mm-sheet::backdrop{background:#0004}.mm-sheet h2{margin-top:0}.mm-sheet p{font-size:calc(15px * var(--mm-text-scale))}.mm-hidden{display:none}.mm-recipe-card{display:block;width:100%;padding:0!important;overflow:hidden;border-radius:24px!important;background:var(--mm-surface)!important;text-align:start}.mm-recipe-art{height:100px;background:#f3efff;display:flex;align-items:center;justify-content:center;gap:8px}.mm-recipe-art .bubble{display:block;background:#ffffffae;color:#292333;padding:10px 16px;border-radius:14px;max-width:82%;font-size:calc(13px * var(--mm-text-scale))}.mm-recipe-art .heart-art{background:#fff8d8;border-radius:8px;border:1px solid #cec9ad;padding:15px 20px;font:14px Georgia,"Songti SC",serif;color:#625f45;transform:rotate(-4deg)}.mm-recipe-body{padding:14px 16px}.mm-recipe-body b{font-size:calc(17px * var(--mm-text-scale));font-weight:550}.mm-recipe-body small{display:block;margin-top:5px}.mm-recipe-grid{display:grid;gap:12px}.mm-tips-step{padding:20px;background:var(--mm-surface);border-radius:24px;margin:12px 0}.mm-tips-step h2{margin:0 0 10px}.mm-tips-step p{font-size:calc(16px * var(--mm-text-scale));line-height:1.8;margin-bottom:0}.mm-source-note{font-size:calc(13px * var(--mm-text-scale));color:var(--mm-secondary);line-height:1.6;margin-top:20px}
@media(prefers-color-scheme:dark){.mm-screen{--mm-bg:var(--as-bg);--mm-surface:var(--as-bg-grouped-2);--mm-ink:var(--as-label);--mm-secondary:color-mix(in srgb,var(--as-label) 66%,transparent);--mm-line:var(--as-separator);--mm-soft:color-mix(in srgb,var(--as-blue) 14%,var(--as-bg-grouped-2));--mm-danger:#ffb3b7;color-scheme:dark}.mm-screen .primary{color:#000!important}.mm-bottom .as-glass{--as-glass-fill:rgba(28,28,30,.88)}.mm-error{background:#412b2b}.mm-mini-widget,.mm-mini-home,.mm-swatch,.mm-recipe-art{filter:brightness(.8)}}
@media(prefers-contrast:more){.mm-screen{--mm-secondary:var(--mm-ink);--mm-line:var(--mm-ink)}.mm-screen .mm-list,.mm-screen .mm-preview-card,.mm-screen .mm-style-option{outline:1px solid var(--mm-ink)}}
@media(prefers-reduced-transparency:reduce){.mm-bottom .as-glass{--as-glass-fill:var(--mm-surface);backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(prefers-reduced-motion:reduce){.mm-screen *{animation:none!important;transition:none!important}.mm-screen button:active{transform:none}}
@container(max-width:350px){.mm-content{padding-inline:16px}.mm-bottom{inset-inline:12px}.mm-tabs button{font-size:calc(11px * var(--mm-text-scale))}.mm-category{padding:12px!important}.mm-style-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mm-screen h1{font-size:calc(30px * var(--mm-text-scale))}}
@container(min-width:600px){.mm-content{padding-inline:32px}.mm-recipe-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.mm-screen{--as-accent:var(--mm-accent);--mm-text-scale:1;font-size:calc(17px * var(--mm-text-scale))}
.mm-screen[data-mm-text-size=accessibility]{--mm-text-scale:3.12}
.mm-screen[data-mm-text-size=accessibility] .mm-grid,.mm-screen[data-mm-text-size=accessibility] .mm-style-grid{grid-template-columns:1fr}
.mm-screen[data-mm-text-size=accessibility] .mm-control-heading{flex-wrap:wrap}
.mm-screen[data-mm-text-size=accessibility] .mm-row{align-items:flex-start}
.mm-screen[data-mm-text-size=accessibility] .mm-target{flex-wrap:wrap}
.mm-screen[data-mm-text-size=accessibility] .mm-target select{max-width:100%}
.mm-screen .mm-tabs button{font-size:11px}
.mm-screen .mm-mini-widget small{font-size:11px}
.mm-screen .mm-primary-top{pointer-events:auto;background:var(--mm-accent);color:var(--mm-surface);font-size:calc(15px * var(--mm-text-scale));font-weight:600;padding:8px 16px;min-height:44px}
.mm-screen .mm-preview-caption .mm-icon{width:16px;height:16px}
.mm-screen .mm-preview-caption b{font-size:calc(13px * var(--mm-text-scale))}
.mm-compare.as-segmented{display:flex}
.mm-compare .as-segment{flex:1;min-width:0}
.mm-screen .mm-sheet{font-size:calc(17px * var(--mm-text-scale))}
.mm-recipe-art[data-recipe=heart-transparent] .heart-art{background:transparent;border:1px solid #d7c9e7;transform:none}
.mm-recipe-art[data-recipe=heart-glass] .heart-art{background:#ffffff70;border:1px solid #fff;border-radius:18px;transform:none}
.mm-recipe-art[data-recipe=heart-text] .heart-art{background:transparent;border:0;transform:none;padding:8px}
.mm-recipe-art[data-recipe=heart-borderless] .heart-art{background:#fffdf5;border:0;border-radius:14px;transform:none}
.mm-recipe-art[data-recipe=bubble-borderless] .bubble{border-radius:8px}
.mm-recipe-art[data-recipe=bubble-glass] .bubble{background:#ffffff60;border:1px solid #fff;border-radius:12px}
@media(prefers-color-scheme:dark){.mm-screen .mm-primary-top{color:#000}}
.mm-screen[data-mm-text-size=accessibility] h1{font-size:60px;line-height:70px}
.mm-screen[data-mm-text-size=accessibility] h2{font-size:55px;line-height:65px}
.mm-screen[data-mm-text-size=accessibility] h3,.mm-screen[data-mm-text-size=accessibility] .mm-row b{font-size:53px;line-height:62px}
.mm-screen[data-mm-text-size=accessibility] .mm-muted,.mm-screen[data-mm-text-size=accessibility] .mm-intro,.mm-screen[data-mm-text-size=accessibility] .mm-control-heading{font-size:49px;line-height:58px}
.mm-screen[data-mm-text-size=accessibility] .mm-row small{font-size:44px;line-height:52px}
.mm-screen[data-mm-text-size=accessibility] .mm-code-card pre{font-size:44px;line-height:52px}
.mm-screen[data-mm-text-size=accessibility] .mm-code-head,.mm-screen[data-mm-text-size=accessibility] .mm-preview-caption{flex-wrap:wrap}
.mm-screen[data-mm-text-size=accessibility] .mm-top-title{font-size:17px}
.mm-screen[data-mm-text-size=accessibility] .mm-primary-top{font-size:17px}
.mm-screen:dir(rtl) .mm-back .mm-icon,.mm-screen:dir(rtl) .mm-chevron,.mm-screen:dir(rtl) .mm-preview-caption button .mm-icon{transform:scaleX(-1)}
.mm-widget-entry{grid-column:1/-1;min-height:146px!important}.mm-widget-entry .mm-mini-widget{max-width:100%}

.mm-category,.mm-feature,.mm-list,.mm-chapter,.mm-recipe-card,.mm-control-group,.mm-preview-card,.mm-code-card,.mm-screen details,.mm-target,.mm-search-field,.mm-editor{box-shadow:inset 0 0 0 1px var(--mm-line)}
