.mi-demo{border:1px solid rgba(var(--demo-accent-rgb),.1);border-radius:var(--demo-radius);padding:28px var(--demo-pad-lg);margin:20px 0 32px;position:relative;overflow:hidden}.mi-demo::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 30% 20%,rgba(var(--demo-accent-rgb),.03) 0%,transparent 60%);pointer-events:none;opacity:.35}.mi-demo-label{font-family:var(--demo-font-mono);font-size:var(--demo-font-size-sm);color:var(--demo-accent);text-transform:uppercase;letter-spacing:1.5px;margin-bottom:18px;opacity:.7;font-weight:600}.mi-codepen-form{text-align:end;margin-top:33px}.mi-codepen-btn{display:flex;align-items:center;gap:13px;background:var(--demo-surface-deep);border:1px solid var(--demo-border);border-radius:var(--demo-radius);color:var(--secondary-text);font-family:var(--demo-font-mono);font-size:var(--demo-font-size-sm);letter-spacing:.5px;padding:8px 10px;cursor:pointer;line-height:1;transition:color 0.2s ease,border-color 0.2s ease,background 0.2s ease;font-weight:600}.mi-codepen-btn:hover{color:var(--demo-accent);border-color:var(--demo-fill-border-hover)}.mi-codepen-btn svg{width:14px;height:14px;fill:currentColor}.mi-slider-row{display:flex;align-items:center;gap:10px;margin-bottom:6px}.mi-slider-label{font-family:var(--demo-font-mono);font-size:var(--demo-font-size-sm);color:var(--secondary-text);min-width:70px;flex-shrink:0}.mi-slider-val{font-family:var(--demo-font-mono);font-size:var(--demo-font-size-sm);color:var(--demo-accent);min-width:48px;text-align:right;flex-shrink:0}input[type="range"].mi-range{-webkit-appearance:none;appearance:none;width:100%;height:4px;background:var(--demo-border);border-radius:2px;outline:none;cursor:pointer}input[type="range"].mi-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:var(--btn-bg);border:2px solid rgba(var(--demo-accent-rgb),.3);cursor:pointer;transition:transform 0.16s ease,box-shadow 0.16s ease}input[type="range"].mi-range::-webkit-slider-thumb:hover{transform:scale(1.15);box-shadow:0 0 8px rgb(132 13 50 / .5)}input[type="range"].mi-range::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--btn-bg);border:2px solid rgba(var(--demo-accent-rgb),.3);cursor:pointer}.mi-btn-group{display:flex;flex-wrap:wrap;gap:var(--demo-gap);margin:var(--demo-pad) 0 6px}.mi-btn{display:inline-flex;align-items:center;justify-content:center;background:var(--demo-surface);border:1px solid var(--demo-border);border-radius:var(--demo-radius);padding:6px 14px;font-family:var(--demo-font-mono);font-size:var(--demo-font-size-sm);color:var(--secondary-text);cursor:pointer;transition:color 0.2s,border-color 0.2s,background 0.2s;line-height:1.4;letter-spacing:.3px}.mi-btn:hover{background:var(--demo-fill-light);border-color:var(--demo-fill-border-hover);color:var(--demo-accent)}.mi-btn.active{background:var(--demo-fill-medium);border-color:var(--demo-accent);color:var(--demo-accent);font-weight:700}.mi-code-output{background:rgba(var(--demo-accent-rgb),.04);border:1px solid var(--demo-border);border-radius:var(--demo-radius-lg);padding:14px var(--demo-pad);font-family:var(--demo-font-mono);font-size:var(--demo-font-size-base);color:var(--demo-accent);line-height:1.7;white-space:pre-wrap;overflow-wrap:break-word;position:relative;margin-top:var(--demo-pad)}.mi-copy-btn{position:absolute;top:8px;right:8px;background:var(--btn-bg);border:none;border-radius:var(--demo-radius);color:var(--text-color);font-size:var(--demo-font-size-xs);padding:4px 10px;cursor:pointer;font-family:var(--demo-font-mono);transition:background 0.2s ease}.mi-copy-btn:hover{background:var(--btn-bg-hover)}.mi-gradient-layout{display:flex;flex-direction:column;gap:20px}@media (min-width:1123px){.mi-gradient-layout{flex-direction:row;align-items:flex-start}.mi-gradient-controls{width:300px;flex-shrink:0}}.mi-gradient-controls{display:flex;flex-direction:column;gap:14px}.mi-gradient-presets{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}.mi-preset-btn{display:inline-flex;align-items:center;gap:5px;background:var(--demo-surface);border:1px solid var(--demo-border);border-radius:var(--demo-radius);padding:4px 10px;font-family:var(--demo-font-mono);font-size:var(--demo-font-size-xs);color:var(--secondary-text);cursor:pointer;transition:color 0.2s,border-color 0.2s,background 0.2s;line-height:1.4}.mi-preset-btn:hover{background:var(--demo-fill-light);border-color:var(--demo-fill-border-hover);color:var(--demo-accent)}.mi-preset-btn.active{background:var(--demo-fill-medium);border-color:var(--demo-accent);color:var(--demo-accent)}.mi-section-label{font-family:var(--demo-font-mono);font-size:var(--demo-font-size-xs);color:var(--secondary-text);text-transform:uppercase;letter-spacing:1px;opacity:.6;margin-bottom:2px}.mi-gradient-preview-area{flex:1;display:flex;flex-direction:column;gap:12px}.mi-gradient-preview-wrap{flex:1;display:flex;justify-content:center;align-items:center;min-height:300px;border-radius:var(--demo-radius-lg);border:1px solid var(--demo-border);padding:20px;position:relative;background-color:var(--demo-surface);background-image:linear-gradient(45deg,rgba(var(--demo-accent-rgb),.03) 25%,transparent 25%),linear-gradient(-45deg,rgba(var(--demo-accent-rgb),.03) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,rgba(var(--demo-accent-rgb),.03) 75%),linear-gradient(-45deg,transparent 75%,rgba(var(--demo-accent-rgb),.03) 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0}.mi-gradient-preview{width:280px;height:280px;border-radius:var(--demo-radius-lg);background:linear-gradient(145deg,rgba(var(--demo-accent-rgb),.25),rgb(132 13 50 / .35)),url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="280" height="280"><defs><linearGradient id="s" x1="0" y1="0" x2="1" y2="1"><stop offset="0%25" stop-color="%23FFB42F"/><stop offset="50%25" stop-color="%23AE0E38"/><stop offset="100%25" stop-color="%2375bbe8"/></linearGradient></defs><rect width="280" height="280" fill="url(%23s)"/><rect x="20" y="180" width="240" height="6" rx="3" fill="%23f1eeee" opacity="0.3"/><rect x="20" y="196" width="180" height="6" rx="3" fill="%23f1eeee" opacity="0.2"/><rect x="20" y="212" width="120" height="6" rx="3" fill="%23f1eeee" opacity="0.15"/><circle cx="140" cy="90" r="50" fill="none" stroke="%23f1eeee" stroke-width="2" opacity="0.4"/><circle cx="140" cy="90" r="30" fill="none" stroke="%23FFB42F" stroke-width="1.5" opacity="0.5"/><line x1="40" y1="40" x2="240" y2="40" stroke="%23f1eeee" stroke-width="1" opacity="0.15"/><line x1="40" y1="140" x2="240" y2="140" stroke="%23f1eeee" stroke-width="1" opacity="0.15"/></svg>');background-size:cover;-webkit-mask-image:linear-gradient(180deg,black 0%,transparent 100%);mask-image:linear-gradient(180deg,black 0%,transparent 100%);transition:mask-image 0.3s ease,-webkit-mask-image 0.3s ease;position:relative}.mi-gradient-mask-viz{display:flex;align-items:center;gap:10px;padding:0 4px}.mi-mask-viz-label{font-family:var(--demo-font-mono);font-size:var(--demo-font-size-xs);color:var(--secondary-text);flex-shrink:0;min-width:70px;opacity:.7}.mi-mask-viz-bar{flex:1;height:16px;border-radius:3px;border:1px solid var(--demo-border);transition:background 0.3s ease}.mi-gradient-reset-row{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:2px}.mi-reset-btn{display:inline-flex;align-items:center;gap:4px;background:none;border:1px solid var(--demo-border);border-radius:var(--demo-radius);padding:3px 10px;font-family:var(--demo-font-mono);font-size:var(--demo-font-size-xs);color:var(--secondary-text);cursor:pointer;transition:color 0.2s,border-color 0.2s}.mi-reset-btn:hover{color:var(--demo-accent);border-color:var(--demo-fill-border-hover)}.mi-gradient-hint{font-family:var(--demo-font-mono);font-size:var(--demo-font-size-xs);color:var(--secondary-text);opacity:.5;text-align:center;padding:4px 0;transition:opacity 0.3s}.mi-gradient-preview-wrap:hover .mi-gradient-hint{opacity:0}.mi-gallery-layout{display:flex;flex-direction:column;gap:20px}.mi-gallery-picker{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.mi-gallery-thumb{width:56px;height:56px;border-radius:var(--demo-radius);border:2px solid var(--demo-border);cursor:pointer;position:relative;overflow:hidden;transition:border-color 0.2s ease,transform 0.2s ease,box-shadow 0.2s ease;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}.mi-gallery-thumb:hover{border-color:rgba(var(--demo-accent-rgb),.4);transform:scale(1.08)}.mi-gallery-thumb.active{border-color:var(--demo-accent);box-shadow:0 0 12px rgba(var(--demo-accent-rgb),.25)}.mi-gallery-thumb-inner{width:100%;height:100%}.mi-gallery-thumb-label{position:absolute;bottom:-20px;left:50%;transform:translateX(-50%);font-family:var(--demo-font-mono);font-size:9px;color:var(--secondary-text);white-space:nowrap;opacity:0;transition:opacity 0.2s;pointer-events:none}.mi-gallery-thumb:hover .mi-gallery-thumb-label,.mi-gallery-thumb.active .mi-gallery-thumb-label{opacity:1}.mi-gallery-main{display:flex;flex-direction:column;gap:16px}@media (min-width:1123px){.mi-gallery-main{flex-direction:row;align-items:flex-start}.mi-gallery-controls-panel{width:260px;flex-shrink:0}}.mi-gallery-preview-wrap{flex:1;display:flex;justify-content:center;align-items:center;min-height:280px;border-radius:var(--demo-radius-lg);border:1px solid var(--demo-border);padding:20px;background-color:var(--demo-surface);background-image:linear-gradient(45deg,rgba(var(--demo-accent-rgb),.04) 25%,transparent 25%),linear-gradient(-45deg,rgba(var(--demo-accent-rgb),.04) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,rgba(var(--demo-accent-rgb),.04) 75%),linear-gradient(-45deg,transparent 75%,rgba(var(--demo-accent-rgb),.04) 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0}.mi-gallery-preview{width:240px;height:240px;border-radius:var(--demo-radius-lg);background:linear-gradient(145deg,rgba(var(--demo-accent-rgb),.25),rgb(132 13 50 / .35)),url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="240" height="240"><defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1"><stop offset="0%25" stop-color="%23FFB42F"/><stop offset="50%25" stop-color="%23AE0E38"/><stop offset="100%25" stop-color="%2375bbe8"/></linearGradient></defs><rect width="240" height="240" fill="url(%23g)"/><circle cx="120" cy="80" r="40" fill="none" stroke="%23f1eeee" stroke-width="2" opacity="0.35"/><rect x="30" y="150" width="180" height="5" rx="2.5" fill="%23f1eeee" opacity="0.25"/><rect x="30" y="165" width="130" height="5" rx="2.5" fill="%23f1eeee" opacity="0.18"/><rect x="30" y="180" width="90" height="5" rx="2.5" fill="%23f1eeee" opacity="0.12"/></svg>');background-size:cover;transition:mask-image 0.35s ease,-webkit-mask-image 0.35s ease,mask-size 0.35s ease,-webkit-mask-size 0.35s ease,mask-position 0.35s ease,-webkit-mask-position 0.35s ease}.mi-gallery-controls-panel{display:flex;flex-direction:column;gap:14px}.mi-gallery-selected-name{font-family:var(--demo-font-mono);font-size:var(--demo-font-size-sm);color:var(--demo-accent);font-weight:600;text-align:center;padding:4px 0}.mi-card-gradient-1{background:linear-gradient(135deg,#FFB42F,#840d32)}.mi-card-gradient-2{background:linear-gradient(135deg,#2a5d8f,#75bbe8)}.mi-card-gradient-3{background:linear-gradient(135deg,#840d32,#e0234e)}.mi-card-gradient-4{background:linear-gradient(135deg,#4ead80,#2a5d8f)}.mi-card-gradient-5{background:linear-gradient(135deg,#6a4c93,#75bbe8)}.mi-card-gradient-6{background:linear-gradient(135deg,#FFB42F,#E57622)}.mi-mask-star{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M50 2l12.2 37.5H100L68.9 60.5 81.1 98 50 77 18.9 98l12.2-37.5L0 39.5h37.8z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M50 2l12.2 37.5H100L68.9 60.5 81.1 98 50 77 18.9 98l12.2-37.5L0 39.5h37.8z'/%3E%3C/svg%3E")}.mi-mask-hexagon{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpolygon points='50,2 95,25 95,75 50,98 5,75 5,25'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpolygon points='50,2 95,25 95,75 50,98 5,75 5,25'/%3E%3C/svg%3E")}.mi-mask-heart{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M50 88C25 70 5 55 5 35 5 20 17 8 30 8c8 0 15 4 20 12C55 12 62 8 70 8c13 0 25 12 25 27 0 20-20 35-45 53z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M50 88C25 70 5 55 5 35 5 20 17 8 30 8c8 0 15 4 20 12C55 12 62 8 70 8c13 0 25 12 25 27 0 20-20 35-45 53z'/%3E%3C/svg%3E")}.mi-mask-diamond{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpolygon points='50,2 98,50 50,98 2,50'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpolygon points='50,2 98,50 50,98 2,50'/%3E%3C/svg%3E")}.mi-mask-cross{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M35 5h30v30h30v30H65v30H35V65H5V35h30z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M35 5h30v30h30v30H65v30H35V65H5V35h30z'/%3E%3C/svg%3E")}.mi-mask-starburst{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M50 5l8 30 22-22-8 30 30-8-22 22 30 8-30 8 22 22-30-8 8 30-22-22-8 30-8-30-22 22 8-30-30 8 22-22-30-8 30-8L5 25l30 8L27 11l23 24z' transform='scale(0.9) translate(5,5)'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M50 5l8 30 22-22-8 30 30-8-22 22 30 8-30 8 22 22-30-8 8 30-22-22-8 30-8-30-22 22 8-30-30 8 22-22-30-8 30-8L5 25l30 8L27 11l23 24z' transform='scale(0.9) translate(5,5)'/%3E%3C/svg%3E")}.mi-composite-layout{display:flex;flex-direction:column;gap:20px}.mi-composite-top{display:flex;flex-direction:column;gap:16px}.mi-composite-layers{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:0;align-items:center;justify-items:center}@media (max-width:640px){.mi-composite-layers{grid-template-columns:1fr;gap:8px}.mi-composite-op-symbol{transform:rotate(90deg)}}.mi-composite-layer-card{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%}.mi-composite-layer-preview{width:100%;max-width:180px;aspect-ratio:1;border-radius:var(--demo-radius-lg);border:1px solid var(--demo-border);background-color:var(--demo-surface);background-image:linear-gradient(45deg,rgba(var(--demo-accent-rgb),.04) 25%,transparent 25%),linear-gradient(-45deg,rgba(var(--demo-accent-rgb),.04) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,rgba(var(--demo-accent-rgb),.04) 75%),linear-gradient(-45deg,transparent 75%,rgba(var(--demo-accent-rgb),.04) 75%);background-size:12px 12px;background-position:0 0,0 6px,6px -6px,-6px 0;position:relative;overflow:hidden}.mi-composite-layer-inner{position:absolute;inset:0;background:linear-gradient(145deg,rgba(var(--demo-accent-rgb),.2),rgb(132 13 50 / .3),rgb(42 93 143 / .2))}.mi-composite-layer-label{font-family:var(--demo-font-mono);font-size:var(--demo-font-size-xs);color:var(--secondary-text);text-align:center;opacity:.7}.mi-composite-op-symbol{font-family:var(--demo-font-mono);font-size:20px;color:var(--demo-accent);opacity:.6;width:32px;text-align:center;flex-shrink:0}.mi-composite-result-card{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%}.mi-composite-preview{width:100%;max-width:180px;aspect-ratio:1;border-radius:var(--demo-radius-lg);border:2px solid rgba(var(--demo-accent-rgb),.3);background:linear-gradient(145deg,rgba(var(--demo-accent-rgb),.2),rgb(132 13 50 / .3),rgb(42 93 143 / .2));-webkit-mask-image:radial-gradient(circle at 50% 50%,black 30%,transparent 60%),repeating-linear-gradient(45deg,black 0,black 8px,transparent 8px,transparent 16px);mask-image:radial-gradient(circle at 50% 50%,black 30%,transparent 60%),repeating-linear-gradient(45deg,black 0,black 8px,transparent 8px,transparent 16px);-webkit-mask-composite:source-over;mask-composite:add;position:relative;overflow:hidden;box-shadow:0 0 20px rgba(var(--demo-accent-rgb),.1);transition:box-shadow 0.3s ease}.mi-composite-preview::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 30% 30%,rgba(var(--demo-accent-rgb),.3) 0%,transparent 50%),radial-gradient(circle at 70% 70%,rgb(132 13 50 / .25) 0%,transparent 50%);pointer-events:none}.mi-composite-result-label{font-family:var(--demo-font-mono);font-size:var(--demo-font-size-xs);color:var(--demo-accent);text-align:center;font-weight:600}.mi-composite-info{font-family:var(--demo-font-mono);font-size:var(--demo-font-size-sm);color:var(--secondary-text);text-align:center;min-height:20px;padding:10px 16px;background:rgba(var(--demo-accent-rgb),.03);border-radius:var(--demo-radius);border:1px solid rgba(var(--demo-accent-rgb),.06);line-height:1.6;transition:opacity 0.3s ease}.mi-composite-controls{display:flex;flex-direction:column;gap:12px;align-items:center}@keyframes mi-composite-flash{0%{box-shadow:0 0 20px rgba(var(--demo-accent-rgb),.1)}50%{box-shadow:0 0 30px rgba(var(--demo-accent-rgb),.3)}100%{box-shadow:0 0 20px rgba(var(--demo-accent-rgb),.1)}}.mi-scroll-layout{display:flex;flex-direction:column;gap:var(--demo-gap-lg)}.mi-scroll-container{height:260px;overflow-y:auto;border-radius:var(--demo-radius-lg);border:1px solid rgb(74 222 128 / .15);background:#0a0f0a;padding:0;-webkit-mask-image:linear-gradient(to bottom,transparent 0,black 40px,black calc(100% - 40px),transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,black 40px,black calc(100% - 40px),transparent 100%);scrollbar-width:thin;scrollbar-color:rgb(74 222 128 / .3) #fff0}.mi-scroll-container::-webkit-scrollbar{width:6px}.mi-scroll-container::-webkit-scrollbar-thumb{background:rgb(74 222 128 / .3);border-radius:3px}.mi-terminal-line{display:flex;gap:12px;padding:4px 16px;font-family:var(--demo-font-mono);font-size:var(--demo-font-size-sm);line-height:1.8;transition:background 0.15s ease}.mi-terminal-line:hover{background:rgb(74 222 128 / .04)}.mi-line-num{color:rgb(74 222 128 / .25);min-width:28px;text-align:right;user-select:none;flex-shrink:0}.mi-line-text{color:rgb(74 222 128 / .7)}.mi-line-text .mi-t-keyword{color:#4ade80}.mi-line-text .mi-t-string{color:#fbbf24}.mi-line-text .mi-t-comment{color:rgb(74 222 128 / .3);font-style:italic}.mi-line-text .mi-t-fn{color:#75bbe8}.mi-scroll-controls{display:flex;flex-wrap:wrap;align-items:center;gap:var(--demo-gap-lg)}.mi-reveal-layout{display:flex;flex-direction:column;gap:var(--demo-gap-lg)}.mi-reveal-container{position:relative;width:100%;aspect-ratio:16 / 9;margin:0 auto;border-radius:var(--demo-radius-lg);overflow:hidden;cursor:none;border:1px solid var(--demo-border);background:#050505}.mi-reveal-base{position:absolute;inset:0;background-color:#0a0f1a;background-image:linear-gradient(rgb(56 189 248 / .05) 1px,transparent 1px),linear-gradient(90deg,rgb(56 189 248 / .05) 1px,transparent 1px),linear-gradient(rgb(56 189 248 / .03) 1px,transparent 1px),linear-gradient(90deg,rgb(56 189 248 / .03) 1px,transparent 1px),url(/wp-content/themes/thesis/css/singles/mask-image/cyberpunk-city.png);background-size:100px 100px,100px 100px,20px 20px,20px 20px,cover;background-position:center center;background-blend-mode:normal,normal,normal,normal,luminosity;filter:grayscale(1) brightness(.15) contrast(1.2)}.mi-reveal-base-shapes{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.mi-wireframe-cube{width:160px;height:160px;position:relative;transform-style:preserve-3d;transform:rotateX(-20deg) rotateY(45deg);border:1px solid rgb(56 189 248 / .3)}.mi-wireframe-cube::before,.mi-wireframe-cube::after{content:'';position:absolute;inset:0;border:1px solid rgb(56 189 248 / .3)}.mi-wireframe-cube::before{transform:translateZ(-80px)}.mi-wireframe-cube::after{transform:translateZ(80px)}.mi-reveal-color{position:absolute;inset:0;background-image:url(/wp-content/themes/thesis/css/singles/mask-image/cyberpunk-city.webp);background-size:cover;background-position:center;-webkit-mask-image:radial-gradient(circle 120px at 50% 50%,black 0%,transparent 100%);mask-image:radial-gradient(circle 120px at 50% 50%,black 0%,transparent 100%);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;pointer-events:none}.mi-reveal-color-shapes{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.mi-glowing-cube{width:160px;height:160px;position:relative;transform-style:preserve-3d;transform:rotateX(-20deg) rotateY(45deg);background:rgb(56 189 248 / .1);box-shadow:0 0 40px rgb(56 189 248 / .4);border:2px solid #38bdf8}.mi-glowing-cube::before{content:'';position:absolute;inset:0;background:rgb(56 189 248 / .2);transform:translateZ(-80px);box-shadow:0 0 60px rgb(56 189 248 / .6)}.mi-scanner-reticle{position:absolute;top:50%;left:50%;width:240px;height:240px;border:1px dashed rgb(56 189 248 / .4);border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;animation:mi-spin 10s linear infinite;mix-blend-mode:screen}.mi-scanner-reticle::before{content:'';position:absolute;inset:-4px;border:1px solid rgb(56 189 248 / .6);border-radius:50%;border-top-color:#fff0;border-bottom-color:#fff0;animation:mi-spin-reverse 6s linear infinite}.mi-scanner-reticle::after{content:'';position:absolute;top:50%;left:50%;width:10px;height:10px;background:#38bdf8;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 10px #38bdf8}@keyframes mi-spin{100%{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes mi-spin-reverse{100%{transform:rotate(-360deg)}}.mi-reveal-hint{position:absolute;top:85%;left:50%;transform:translateX(-50%);font-family:var(--demo-font-mono);font-size:var(--demo-font-size-xs);color:rgb(56 189 248 / .6);letter-spacing:2px;text-transform:uppercase;pointer-events:none;transition:opacity 0.3s ease;background:rgb(0 0 0 / .6);padding:4px 12px;border-radius:4px;border:1px solid rgb(56 189 248 / .2)}.mi-reveal-container:hover .mi-reveal-hint{opacity:0}.mi-reveal-controls{display:flex;flex-wrap:wrap;align-items:center;gap:var(--demo-gap-lg);justify-content:center}.mi-text-reveal-area{display:flex;justify-content:center;align-items:center;min-height:180px;padding:24px;position:relative;overflow:hidden}.mi-text-reveal-content{font-family:'Instrument Serif',serif;font-size:clamp(36px, 8vw, 72px);font-weight:400;color:var(--text-color);text-align:center;line-height:1.2;letter-spacing:-.02em;position:relative;-webkit-mask-image:linear-gradient(to right,black 0%,black 40%,transparent 60%,transparent 100%);mask-image:linear-gradient(to right,black 0%,black 40%,transparent 60%,transparent 100%);-webkit-mask-size:300% 100%;mask-size:300% 100%;-webkit-mask-position:100% 0;mask-position:100% 0}.mi-text-reveal-content span{background:linear-gradient(135deg,var(--demo-accent),#E57622,#840d32);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:#fff0}.mi-text-shimmer{position:absolute;inset:0;background:linear-gradient(110deg,transparent 0%,rgba(var(--demo-accent-rgb),.15) 48%,rgba(var(--demo-accent-rgb),.3) 50%,rgba(var(--demo-accent-rgb),.15) 52%,transparent 100%);background-size:300% 100%;background-position:100% 0;pointer-events:none;mix-blend-mode:screen}.mi-text-controls{display:flex;flex-direction:column;gap:14px;margin-top:var(--demo-pad)}.mi-text-controls-row{display:flex;align-items:center;justify-content:center;gap:var(--demo-gap-lg);flex-wrap:wrap}.mi-text-input-row{display:flex;align-items:center;gap:10px;justify-content:center}.mi-text-input{background:var(--demo-surface);border:1px solid var(--demo-border);border-radius:var(--demo-radius);color:var(--text-color);font-family:var(--demo-font-mono);font-size:var(--demo-font-size-sm);padding:6px 12px;width:240px;max-width:100%;outline:none;transition:border-color 0.2s}.mi-text-input:focus{border-color:var(--demo-accent)}.mi-text-input::placeholder{color:var(--secondary-text);opacity:.5}.mi-play-btn{background:var(--demo-surface);border:1px solid var(--demo-border);border-radius:var(--demo-radius);color:var(--text-color);padding:6px 16px;font-size:var(--demo-font-size-base);cursor:pointer;font-family:var(--demo-font-mono);transition:all 0.2s ease;flex-shrink:0}.mi-play-btn:hover{border-color:var(--demo-accent);color:var(--demo-accent)}.mi-scrub-row{display:flex;align-items:center;gap:10px;width:100%}.mi-scrub-label{font-family:var(--demo-font-mono);font-size:var(--demo-font-size-xs);color:var(--secondary-text);flex-shrink:0;min-width:46px;opacity:.7}.mi-text-mask-viz{height:12px;flex:1;border-radius:3px;border:1px solid var(--demo-border);transition:background 0.15s ease}.mi-compare-table{width:100%;border-collapse:collapse;font-size:var(--demo-font-size-md)}.mi-compare-table th,.mi-compare-table td{padding:10px 14px;border:1px solid var(--demo-border);text-align:left}.mi-compare-table th{background:rgba(var(--demo-accent-rgb),.08);color:var(--demo-accent);font-family:var(--demo-font-mono);font-size:var(--demo-font-size-sm);font-weight:700}.mi-compare-table td{color:var(--secondary-text)}.mi-support-grid{display:grid;grid-template-columns:1fr repeat(4,1fr);gap:1px;background:var(--demo-border);border-radius:var(--demo-radius);overflow:hidden;margin:16px 0}.mi-support-cell{background:var(--demo-surface);padding:10px 12px;font-size:var(--demo-font-size-md);text-align:center;color:var(--text-color)}.mi-support-cell.mi-header{background:rgba(var(--demo-accent-rgb),.06);font-weight:700;color:var(--demo-accent)}.mi-support-cell.mi-prop-name{text-align:left;font-family:var(--demo-font-mono);font-size:var(--demo-font-size-sm);color:var(--demo-accent)}.mi-yes{color:#4ade80}.mi-no{color:#f87171}@media (max-width:640px){.mi-demo{padding:20px var(--demo-pad)}.mi-btn-group{gap:6px}.mi-btn{padding:5px 10px;font-size:var(--demo-font-size-xs)}.mi-slider-row{margin-bottom:10px;width:100%}.mi-slider-label{min-width:56px}.mi-slider-val{min-width:36px}input[type="range"].mi-range{flex:1;min-width:0;width:auto}.mi-gallery-thumb{width:44px;height:44px}.mi-gallery-preview{width:200px;height:200px}.mi-text-input{width:180px}.mi-composite-preview,.mi-composite-layer-preview{max-width:200px}.mi-reveal-container{aspect-ratio:4 / 3}.mi-support-grid{grid-template-columns:1fr repeat(2,1fr)}}