@import url("https://rsms.me/inter/inter.css");@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap");:root[data-theme="light"]{--background-main: #f2f0ef;--background-darker: #f8f5f3;--text-color: #3b3b3b;--sec-text-color: #656565;--page-accent: #c6866d;--contrast-overlay: rgba(0, 0, 0, 0.7);--contrast-overlay-hover: rgba(0, 0, 0, 0.5);--translucent-low: rgb(0, 0, 0, 0.05);--translucent-medium: rgb(0, 0, 0, 0.07);--translucent-high: rgb(0, 0, 0, 0.2);--code-bg: #ebe9e8;--note-bg: #d8f2fd}:root[data-theme="blue"]{--background-main: #2d3d5a;--background-darker: #1f2a3f;--text-color: #e8edf5;--sec-text-color: #c6cfdc;--page-accent: #99aac9;--contrast-overlay: rgba(255, 255, 255, 0.7);--contrast-overlay-hover: rgba(255, 255, 255, 0.5);--translucent-low: rgb(255, 255, 255, 0.03);--translucent-medium: rgb(255, 255, 255, 0.07);--translucent-high: rgb(255, 255, 255, 0.2);--code-bg: #1f2a3f;--note-bg: #3a4f6b}:root[data-theme="dark"]{--background-main: #1a1a1a;--background-darker: #2a2a2a;--text-color: #d0d0d0;--sec-text-color: #c2c2c2;--page-accent: #b47d68;--contrast-overlay: rgba(255, 255, 255, 0.7);--contrast-overlay-hover: rgba(255, 255, 255, 0.5);--translucent-low: rgba(255, 255, 255, 0.03);--translucent-medium: rgba(255, 255, 255, 0.07);--translucent-high: rgba(255, 255, 255, 0.2);--code-bg: #212121;--note-bg: #4a606a}:root[data-theme="red"]{--background-main: #2a1a1d;--background-darker: #3d1f24;--text-color: #f5e8ea;--sec-text-color: #d7cbd0;--page-accent: #a88088;--contrast-overlay: rgba(255, 255, 255, 0.7);--contrast-overlay-hover: rgba(255, 255, 255, 0.5);--translucent-low: rgb(255, 255, 255, 0.03);--translucent-medium: rgb(255, 255, 255, 0.07);--translucent-high: rgb(255, 255, 255, 0.2);--code-bg: #3d1f24;--note-bg: #4a2d33}:root{--spacing-xs: 5px;--spacing-sm: 8px;--spacing-md: 10px;--spacing-lg: 15px;--spacing-xl: 20px;--spacing-2xl: 30px;--spacing-3xl: 60px;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-xl: 12px;--radius-round: 50%;--transition-fast: 0.1s ease;--transition-medium: 0.2s ease;--transition-slow: 0.3s ease;--transition-backdrop: 0.4s ease;--shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.1);--shadow-md: 0 4px 8px rgba(0, 0, 0, 0.1);--shadow-lg: 0 8px 16px rgba(0, 0, 0, 0.1);--z-dropdown: 100;--z-sticky: 200;--z-fixed: 300;--z-modal: 1000;--z-tooltip: 1100;--game-flappy-text: #3b3b3b;--game-flappy-overlay: rgba(255, 255, 255, 0.6);--game-flappy-overlay-strong: rgba(255, 255, 255, 0.7);--game-ttt-x: #66b5f5;--game-ttt-o: #ff7369;--game-ttt-win: #4CAF50;--game-gol-cell-alive: #333333;--game-gol-cell-border: #dddddd;--game-ms-1: #0000FF;--game-ms-2: #007B00;--game-ms-3: #FF0000;--game-ms-4: #00007B;--game-ms-5: #7B0000;--game-ms-6: #007B7B;--game-ms-7: #000000;--game-ms-8: #7B7B7B;--game-colordle-correct: #65c467;--game-colordle-close: #d5a04c;--game-colordle-wrong: #757575;--game-status-win: #4CAF50;--game-status-lose: #F44336;--game-status-success: #2E7D32;--game-status-error: #C62828;--color-line-number: #d9d9d9;--color-code-border: #d9d9d9;--color-code-break: #606060;--color-link-underline: #dadada;--color-social-instagram: #b6393d;--color-social-tiktok: #9860d5}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:1em;font:inherit;vertical-align:baseline}a{text-decoration:none}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}table{border-collapse:collapse;border-spacing:0}*{font-family:"-apple-system", "inter", sans-serif}body{color:var(--text-color);font-family:"-apple-system", "inter", sans-serif;font-weight:300;word-wrap:break-word}h1{margin-bottom:var(--spacing-md);font-size:16pt;color:var(--text-color);font-weight:800;margin-top:var(--spacing-md);margin-bottom:var(--spacing-sm)}h2{font-size:14pt;color:var(--text-color);font-weight:700;margin-top:var(--spacing-xs);margin-bottom:var(--spacing-md)}h3{font-size:12pt;color:var(--text-color);font-weight:700;margin-top:var(--spacing-xs);margin-bottom:var(--spacing-md)}p{font-size:12pt;font-weight:300;line-height:1.25em}.post__content p{font-size:11.5pt;font-weight:300;line-height:16pt;padding-bottom:var(--spacing-md);text-align:left;word-wrap:break-word;letter-spacing:0.2px;color:var(--sec-text-color)}strong,b{font-weight:600}em,i{font-style:italic}a{line-height:25px;color:var(--text-color);text-decoration:none;transition:color var(--transition-medium)}@media (any-hover: hover){a:hover{color:var(--page-accent)}}a.touch-hover{color:var(--page-accent)}code,.highlighter-rouge{font-family:"IBM Plex Mono", monospace;font-size:11pt;background:var(--code-bg);padding:0.5px 5px;word-wrap:break-word;font-weight:400;color:var(--text-color)}code a,.highlighter-rouge a{text-decoration:none}sup{vertical-align:super;font-size:8pt}.ph{vertical-align:text-bottom}button,.btn{padding:var(--spacing-sm) var(--spacing-lg);background-color:var(--contrast-overlay);color:var(--background-main);border:none;border-radius:var(--radius-md);font-size:1em;font-weight:400 !important;cursor:pointer;transition:background-color var(--transition-medium);backdrop-filter:blur(10px);font-family:-apple-system, "Inter", sans-serif;text-decoration:none !important}@media (any-hover: hover){button:hover,.btn:hover{background-color:var(--contrast-overlay-hover);color:var(--background-main)}}button.touch-hover,.btn.touch-hover{background-color:var(--contrast-overlay-hover);color:var(--background-main)}button--dark-forced,.btn--dark-forced{background-color:rgba(0,0,0,0.7)}@media (any-hover: hover){button--dark-forced:hover,.btn--dark-forced:hover{background-color:rgba(0,0,0,0.5)}}button--dark-forced.touch-hover,.btn--dark-forced.touch-hover{background-color:rgba(0,0,0,0.5)}button--small,.btn--small{padding:2px var(--spacing-sm);font-size:0.8em}button--link-variant,.btn--link-variant{display:flex;justify-content:space-between;align-items:center;background-color:var(--translucent-low);backdrop-filter:none;font-size:0.9em;color:var(--sec-text-color);padding:3px var(--spacing-sm) 3px var(--spacing-sm);outline:solid;outline-width:1px;outline-color:var(--translucent-medium);margin-bottom:var(--spacing-lg)}button--copy,.btn--copy{padding:2px var(--spacing-sm);font-size:0.8em;background-color:var(--translucent-medium);color:var(--text-color)}@media (any-hover: hover){button--copy:hover,.btn--copy:hover{background-color:var(--contrast-overlay);color:var(--background-main)}}button--copy.touch-hover,.btn--copy.touch-hover{background-color:var(--contrast-overlay);color:var(--background-main)}button--outline,.btn--outline{background-color:var(--translucent-low);color:var(--text-color);outline:solid 1px var(--translucent-high)}button--outline:hover,.btn--outline:hover{background-color:var(--translucent-high);color:var(--text-color)}button code,.btn code{background-color:transparent}input[type="file"]::file-selector-button{padding:var(--spacing-sm) var(--spacing-lg);background-color:var(--contrast-overlay);color:var(--background-main);border:none;border-radius:var(--radius-md);font-family:-apple-system, "Inter", sans-serif;font-size:1.2em;font-weight:400 !important;cursor:pointer;transition:background-color var(--transition-medium)}.expandable-toggle{width:100%;padding:var(--spacing-md) var(--spacing-lg);background-color:var(--translucent-low);backdrop-filter:blur(10px);border:none;border-radius:var(--radius-md);text-align:left;cursor:pointer;display:flex;justify-content:space-between;align-items:center;color:var(--text-color);transition:background-color var(--transition-medium),color var(--transition-medium);outline:solid;outline-width:1px;outline-color:var(--translucent-medium)}@media (any-hover: hover){.expandable-toggle:hover{background-color:var(--contrast-overlay);color:var(--background-main)}}.expandable-toggle.touch-hover{background-color:var(--contrast-overlay);color:var(--background-main)}.expandable-toggle .toggle-icon{transition:transform var(--transition-slow)}.expandable-toggle[aria-expanded="true"] .toggle-icon{transform:rotate(45deg)}.selection-switch{display:flex;margin:var(--spacing-md) 0;gap:var(--spacing-md);flex-wrap:wrap;align-self:center}.selection-switch .switch-option{padding:var(--spacing-sm) var(--spacing-lg);border:none;border-radius:20px;background-color:var(--translucent-low);color:var(--text-color);cursor:pointer;transition:all var(--transition-medium);font-family:"Inter", sans-serif;display:inline-block;outline:solid;outline-width:1px;outline-color:var(--translucent-medium)}@media (any-hover: hover){.selection-switch .switch-option:hover{background-color:var(--contrast-overlay);color:var(--background-main)}}.selection-switch .switch-option.touch-hover{background-color:var(--contrast-overlay);color:var(--background-main)}.selection-switch .switch-option.active{background-color:var(--contrast-overlay);color:var(--background-main);outline:none}.card{background-color:var(--translucent-medium);backdrop-filter:blur(10px);border-radius:var(--radius-md);padding:var(--spacing-lg);transition:background-color var(--transition-medium)}@media (any-hover: hover){.card:hover{background-color:var(--translucent-high)}}.card.touch-hover{background-color:var(--translucent-high)}.card--interactive{cursor:pointer}.card--no-padding{padding:0}.image-card{break-inside:avoid;margin-bottom:-10px;cursor:pointer}.image-card .image-wrapper img{width:100%;height:auto;display:block;object-fit:contain}.album-item{text-align:center;width:100%;height:100%;margin-bottom:-0.7em;position:relative}.album-item .album-image-container{position:relative;display:inline-block;width:100%;height:100%}.album-item .album-image-container img{display:block;width:100%;height:100%;object-fit:cover;outline:solid;outline-width:1px;outline-color:var(--translucent-low)}.album-item .music-album-info-overlay{position:absolute;top:var(--spacing-md);bottom:-10px;left:0;right:0;background-color:rgba(0,0,0,0.6);padding:0.8em;border-radius:var(--radius-md);opacity:0;transition:opacity var(--transition-slow)}.album-item .music-album-info-overlay .music-album-title{color:rgba(255,255,255,0.9);font-size:1.2em !important;word-break:break-word}.album-item .music-album-info-overlay .music-artist-name-overlay{color:rgba(255,255,255,0.9);font-size:0.8em !important;font-weight:600;margin-top:-10px;word-break:break-word}.album-item .album-image-container:hover .music-album-info-overlay,.album-item .music-album-info-overlay.show-overlay{opacity:1;border-radius:var(--radius-md)}.color-info{background-color:var(--translucent-low);backdrop-filter:blur(10px);border-radius:var(--radius-md);outline:1px solid var(--translucent-medium)}.color-info .color-detail{padding:var(--spacing-lg);display:flex;align-items:center;gap:var(--spacing-xl);flex-wrap:wrap}.color-info .color-preview{width:80px;height:80px;border-radius:var(--radius-md)}.color-info .color-values{line-height:1.5em}.color-info .color-value{display:flex;align-items:center;flex-wrap:wrap;gap:var(--spacing-md)}.color-info .color-code{font-family:"IBM Plex Mono", ui-monospace, monospace}.grid{display:grid;gap:var(--spacing-md)}.grid--2-col{grid-template-columns:repeat(2, 1fr)}.grid--3-col{grid-template-columns:repeat(3, 1fr)}.grid--4-col{grid-template-columns:repeat(4, 1fr)}.grid--5-col{grid-template-columns:repeat(5, 1fr)}.grid--auto-fit{grid-template-columns:repeat(auto-fit, minmax(200px, 1fr))}.grid--auto-fill{grid-template-columns:repeat(auto-fill, minmax(200px, 1fr))}.grid--masonry{column-count:2;column-gap:var(--spacing-md);display:block}.grid--equal-rows{grid-auto-rows:1fr}.grid--gap-sm{gap:var(--spacing-xs)}.grid--gap-lg{gap:var(--spacing-xl)}.grid--no-gap{gap:0}.album-grid{display:grid;grid-template-columns:repeat(3, 1fr);gap:10px}@media (max-width: 768px){.album-grid{grid-template-columns:repeat(2, 1fr)}}.album-container{display:flex;flex-wrap:wrap;gap:var(--spacing-md);max-width:100%;margin:0 auto}.album-container .masonry-column{flex:1;display:flex;flex-direction:column;gap:var(--spacing-sm)}.album-container>img{width:100%;max-width:100%;height:auto;border-radius:var(--radius-md)}.palette-output{display:grid;grid-template-columns:repeat(5, 1fr);gap:var(--spacing-md);width:100%;margin-bottom:var(--spacing-xl);grid-auto-rows:1fr}@media (max-width: 600px){.palette-output{grid-template-columns:repeat(3, 1fr)}}.color-swatch{aspect-ratio:1/1;width:100%;border-radius:var(--radius-md);cursor:pointer;transition:transform var(--transition-medium)}@media (any-hover: hover){.color-swatch:hover{transform:scale(1.05)}}.color-swatch.touch-hover{transform:scale(1.05)}.game-grid{display:grid;gap:var(--spacing-sm)}.game-grid--ttt{grid-template-columns:repeat(3, 1fr);grid-template-rows:repeat(3, 1fr);gap:var(--spacing-sm)}.game-grid--minesweeper{max-width:100%;overflow:hidden;box-sizing:border-box}input[type="text"],input[type="email"],input[type="url"],select{padding:9px var(--spacing-md);background-color:var(--translucent-low);border:var(--translucent-medium);border-radius:var(--radius-md);color:var(--text-color);font-family:-apple-system, "Inter", sans-serif;transition:background-color var(--transition-medium);outline:solid;outline-width:1px;outline-color:var(--translucent-medium)}input[type="text"]:focus,input[type="email"]:focus,input[type="url"]:focus,select:focus{outline:none;background-color:var(--translucent-high)}input[type="text"]::placeholder,input[type="email"]::placeholder,input[type="url"]::placeholder,select::placeholder{color:var(--sec-text-color);opacity:0.7}input[type="range"]{display:block;width:100%;margin:var(--spacing-md) 0;-webkit-appearance:none;appearance:none;height:30px;background:linear-gradient(to right, var(--translucent-high) var(--value-percent, 0%), var(--translucent-low) var(--value-percent, 0%));backdrop-filter:blur(10px);border-radius:var(--radius-sm);outline:none;transition:all var(--transition-fast) ease-in-out;outline:solid;outline-width:1px;outline-color:var(--translucent-medium)}input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:4px;height:34px;background:var(--sec-text-color);border-radius:var(--spacing-md);cursor:pointer;transition:all var(--transition-fast) ease-in-out}input[type="range"]::-moz-range-thumb{width:4px;height:34px;background:var(--sec-text-color);border-radius:var(--spacing-md);cursor:pointer;transition:all var(--transition-fast) ease-in-out}input[type="range"]:active::-webkit-slider-thumb{transform:scale(1.1);width:5px}input[type="range"]:active::-moz-range-thumb{transform:scale(1.1);width:5px}input[type="color"]{width:50px;height:40px;border:none;border-radius:var(--radius-md);background-color:var(--translucent-low);backdrop-filter:blur(10px);cursor:pointer;transition:all var(--transition-medium);padding:0;overflow:hidden;outline:solid;outline-width:1px;outline-color:var(--translucent-medium)}input[type="color"]::-webkit-color-swatch-wrapper{padding:0;border:none;border-radius:var(--radius-md)}input[type="color"]::-webkit-color-swatch{border:none;border-radius:var(--radius-md)}input[type="color"]::-moz-color-swatch{border:none;border-radius:var(--radius-md)}.controls{margin-top:var(--spacing-md);padding-bottom:var(--spacing-md);flex-wrap:wrap;gap:var(--spacing-sm)}.controls>*{margin-bottom:var(--spacing-md)}.controls:last-child{margin-bottom:0}.controls label{display:block;margin:var(--spacing-md) 0}.controls a{margin-left:5px}.controls .range-width-container{display:flex;position:relative}.controls .range-width-container #range-value{position:absolute;top:14px;left:var(--spacing-sm);font-size:0.7em;z-index:1}.color-inputs-container{display:flex;gap:var(--spacing-xl);margin:var(--spacing-lg) 0;flex-wrap:wrap}.color-input-group{flex:1;min-width:200px}.color-input-wrapper{display:flex;gap:var(--spacing-sm);align-items:center;margin-top:var(--spacing-sm)}.color-input-wrapper input[type="text"]{flex:1;font-family:"Inter", monospace;font-size:0.9em}.image-selector{width:100%;height:200px;background-color:var(--translucent-low);border-radius:var(--radius-md);display:flex;justify-content:center;align-items:center;margin-bottom:var(--spacing-xl);cursor:pointer;font-size:0.9em;font-weight:500;backdrop-filter:blur(10px);transition:all var(--transition-medium);outline:solid;outline-width:1px;outline-color:var(--translucent-medium)}@media (any-hover: hover){.image-selector:hover{background-color:var(--translucent-high)}}.image-selector.touch-hover{background-color:var(--translucent-high)}html{background-color:var(--background-main);height:100%;min-height:100vh}html.theme-transition{transition:background-color var(--transition-backdrop)}body{height:100%;min-height:100vh}.wrapper{max-width:525px;margin:auto;padding:var(--spacing-3xl) var(--spacing-2xl)}@media screen and (max-width: 600px){.wrapper{padding:var(--spacing-xl)}}.fullscreen{margin:0;padding:0;height:100%;overflow:hidden}.game-wrapper{height:100vh;width:100%;justify-content:center;position:relative;box-sizing:border-box;overflow-x:hidden}.expandable-content{padding:var(--spacing-md) var(--spacing-lg) 0px var(--spacing-lg);margin-top:var(--spacing-md);margin-bottom:var(--spacing-md);background-color:var(--translucent-low);backdrop-filter:blur(10px);border-radius:var(--radius-md);outline:1px solid var(--translucent-medium);overflow:hidden;opacity:1;transition:max-height var(--transition-slow),opacity var(--transition-slow),margin-top var(--transition-slow),margin-bottom var(--transition-slow),padding-top var(--transition-slow),padding-bottom var(--transition-slow);will-change:max-height, opacity, margin-top, margin-bottom, padding-top, padding-bottom}.expandable-content.collapsed{max-height:0px !important;opacity:0;margin-bottom:0px !important;padding-top:0px !important;padding-bottom:0px !important}.backdrop-blur{backdrop-filter:blur(10px)}.translucent-bg{background-color:var(--translucent-medium)}.translucent-bg-high{background-color:var(--translucent-high)}.flex-center{display:flex;align-items:center;justify-content:center}.flex-between{display:flex;justify-content:space-between;align-items:center}.flex-start{display:flex;align-items:start}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.full-width{width:100%}.full-height{height:100%}.va-mid{vertical-align:middle}.mb-0{margin-bottom:0}.mb-sm{margin-bottom:var(--spacing-sm)}.mb-md{margin-bottom:var(--spacing-md)}.mb-lg{margin-bottom:var(--spacing-lg)}.mb-xl{margin-bottom:var(--spacing-xl)}.mt-0{margin-top:0}.mt-sm{margin-top:var(--spacing-sm)}.mt-md{margin-top:var(--spacing-md)}.mt-lg{margin-top:var(--spacing-lg)}.mt-xl{margin-top:var(--spacing-xl)}.p-0{padding:0}.p-sm{padding:var(--spacing-sm)}.p-md{padding:var(--spacing-md)}.p-lg{padding:var(--spacing-lg)}.p-xl{padding:var(--spacing-xl)}.hidden{display:none}.invisible{visibility:hidden}.opacity-0{opacity:0}.opacity-50{opacity:0.5}.cursor-pointer{cursor:pointer}.cursor-not-allowed{cursor:not-allowed}.rounded-sm{border-radius:var(--radius-sm)}.rounded-md{border-radius:var(--radius-md)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-full{border-radius:var(--radius-round)}.transition-fast{transition:all var(--transition-fast)}.transition-medium{transition:all var(--transition-medium)}.transition-slow{transition:all var(--transition-slow)}