.left-column{flex-direction:column;gap:15px;display:flex}.search-section{align-items:center;gap:8px;margin-bottom:8px;display:flex}.search-status{color:var(--text-color);border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);text-align:center;min-width:80px;padding:6px;font-size:12px}.file-upload-wrapper{flex-wrap:wrap;gap:8px;margin-bottom:8px;display:flex}.textarea-container{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);flex:1;min-height:400px;position:relative}.highlight-area{white-space:pre-wrap;word-wrap:break-word;color:#0000;pointer-events:none;z-index:1;width:100%;height:100%;padding:8px;font-family:"Press Start 2P",cursive;font-size:12px;line-height:1.5;position:absolute;top:0;left:0;overflow:auto}#textInput{resize:none;width:100%;height:100%;color:var(--text-color);z-index:2;background:0 0;border:none;outline:none;padding:8px;font-family:"Press Start 2P",cursive;font-size:12px;line-height:1.5;position:absolute;top:0;left:0}.highlight-match{color:var(--text-color);background-color:#ff0}.stats-header{background:var(--button-pressed);border-bottom:1px solid var(--border-dark);color:var(--text-color);padding:8px;font-size:12px;font-weight:400}.stats-grid{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);grid-template-columns:repeat(3,1fr);display:grid}.stat-item{text-align:center;border-right:1px solid var(--border-dark);border-bottom:1px solid var(--border-dark);padding:12px}.stat-item:nth-child(3n){border-right:none}.stat-item:nth-last-child(-n+3){border-bottom:none}.stat-value{color:var(--header-title);margin-bottom:4px;font-size:14px;font-weight:400}.stat-label{color:var(--text-color);font-size:12px}.detailed-stats{margin-bottom:15px}.detailed-header{background:var(--button-pressed);border-bottom:1px solid var(--border-dark);color:var(--text-color);padding:8px;font-size:12px;font-weight:400}.tab-bar{border-style:solid;border-width:1px;border-color:var(--border);background:var(--window-bg);gap:2px;padding:2px;display:flex}.tab-button{border-style:solid;border-width:1px;border-color:var(--border);background:var(--button-face);color:var(--text-color);cursor:pointer;text-align:center;flex:1;padding:6px 8px;font-size:12px;transition:none}.tab-button:active{border-color:var(--border);padding:7px 7px 5px 9px}.tab-button.active{background:var(--button-pressed);border-color:var(--border);padding:7px 7px 5px 9px;font-weight:700}.detailed-content{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);min-height:200px;padding:12px}.detail-row{border-bottom:1px solid var(--border-dark);justify-content:space-between;align-items:center;padding:8px 0;display:flex}.detail-row:last-child{border-bottom:none}.detail-label{color:var(--text-color);font-size:12px}.detail-value{color:var(--header-title);font-size:12px;font-weight:400}.reading-title{color:var(--text-color);margin-bottom:12px;font-size:12px;font-weight:400}.reading-grid{grid-template-columns:repeat(2,1fr);gap:12px;display:grid}.reading-item{border-style:solid;border-width:1px;border-color:var(--border);background:var(--window-bg);text-align:center;padding:10px}.reading-item .stat-value{color:var(--header-title);margin-bottom:4px;font-size:12px}.reading-item .stat-label{color:var(--text-color);font-size:12px}@media (width<=1000px){.main-grid{grid-template-columns:1fr;gap:15px}.stat-item:nth-child(3n){border-right:1px solid var(--border-dark)}.stat-item:nth-last-child(-n+3){border-bottom:1px solid var(--border-dark)}.stat-item:last-child{border-bottom:none}.stats-grid{grid-template-columns:repeat(3,1fr)}}@media (width<=768px){body{padding:10px}.container{max-width:100%}.stats-grid{grid-template-columns:repeat(2,1fr)}.stat-item:nth-child(2n){border-right:none}}@media (width<=480px){.stats-grid{grid-template-columns:1fr}.stat-item{border-right:none}.reading-grid{grid-template-columns:1fr}.file-upload-wrapper{flex-direction:column}.file-input-label,.btn{width:100%}}.btn-secondary:active{border-color:var(--border);padding:5px 7px 3px 9px}.action-container{justify-content:center;align-items:center;margin:15px 0;display:flex}@media (width<=768px){body{padding:10px}.container{max-width:100%}.text-area{min-height:150px;padding:10px;font-size:12px}.panel-actions{flex-direction:column;gap:6px}.btn{width:100%}}@media (width<=480px){.text-area{min-height:120px;padding:8px;font-size:12px}.panel-header{flex-direction:column;align-items:flex-start;gap:8px}.panel-actions{width:100%}}.construction-icon{color:var(--border-dark);margin-bottom:15px;font-size:48px;display:block}.construction-title{color:var(--text-color);margin-bottom:10px;font-size:18px;font-weight:400}.construction-subtitle{color:var(--text-color);margin-bottom:15px;font-size:12px}.construction-description{color:var(--text-color);margin-bottom:20px;font-size:12px;line-height:1.4}.back-button{border-style:solid;border-width:1px;border-color:var(--border);background:var(--header-title);color:var(--border-light);text-align:center;cursor:pointer;box-shadow:none;padding:6px 12px;font-family:"Press Start 2P",cursive;font-size:12px;line-height:1;text-decoration:none;transition:none;display:inline-block}.features-list{text-align:left;max-width:300px;margin:0 auto;padding:0;list-style:none}.features-list li{color:var(--text-color);align-items:center;gap:8px;padding:6px 0;font-size:12px;display:flex}.feature-icon{color:var(--border-dark);font-size:12px}.progress-section{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);margin-top:15px;padding:12px}.progress-text{color:var(--text-color);text-align:center;margin-bottom:8px;font-size:12px}@media (width<=768px){body{padding:10px}.container{max-width:100%}.construction-icon{font-size:36px}.construction-title{font-size:14px}.construction-subtitle,.construction-description,.features-list li{font-size:12px}}@media (width<=480px){.construction-icon{font-size:28px}.construction-title,.features-list li{font-size:12px}}.header{text-align:left;margin-bottom:12px;position:relative}.retro-button{border-style:solid;border-width:1px;border-color:var(--border);background:var(--button-face);color:var(--text-color);text-align:center;cursor:pointer;box-shadow:none;padding:8px 15px;font-size:12px;line-height:1;transition:none}.retro-button:active{border-color:var(--border);padding:9px 14px 7px 16px}.category-selector{margin-bottom:15px}.category-tabs{border-style:solid;border-width:1px;border-color:var(--border);background:var(--window-bg);flex-wrap:wrap;gap:6px;margin-top:-1px;padding:12px;display:flex}.category-tab{border:1px solid;border-color:var(--border);background:var(--button-face);cursor:pointer;flex-grow:1;min-width:90px;padding:6px 10px;font-size:12px;transition:none}.category-tab.active{border-color:var(--border);background:var(--button-pressed);padding:7px 9px 5px 11px;font-weight:700}.converter-section{border-style:solid;border-width:1px;border-color:var(--border);background:var(--button-pressed);margin-bottom:15px;padding:1px}.converter-content{padding:15px}.conversion-row{grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;margin-bottom:15px;display:grid}.input-group{flex-direction:column;gap:6px;display:flex}.input-label{color:var(--text-color);font-size:12px;font-weight:400}.unit-input{border:1px solid;border-color:var(--border);background:var(--input-bg);color:var(--text-color);text-align:left;outline:none;height:32px;padding:6px;font-size:12px;line-height:1}.unit-input[readonly]{background:var(--button-face);color:var(--border-dark)}.unit-select{border:1px solid;border-color:var(--border);background:var(--input-bg);color:var(--text-color);appearance:none;outline:none;height:32px;padding:6px;font-size:12px;line-height:1;background-image:none!important}.swap-button{border-style:solid;border-width:1px;border-color:var(--border);background:var(--button-face);color:var(--text-color);cursor:pointer;width:40px;min-height:32px;margin-bottom:30px;padding:6px;font-size:16px;line-height:1;transition:none}.swap-button:active{border-color:var(--border);padding:7px 5px 5px 7px}.conversion-formula,.error{border-style:solid;border-width:1px;border-color:var(--border);color:var(--text-color);background:var(--input-bg);margin-top:15px;padding:8px;font-family:"Press Start 2P",monospace;font-size:12px;overflow-x:auto}.common-conversions{margin-top:15px;padding:0}.common-header{padding:6px 0;font-size:12px;font-weight:700}.common-list{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);padding:8px}.common-item{border-bottom:none;justify-content:space-between;align-items:center;padding:6px 0;font-size:12px;display:flex}.common-left,.common-right{color:var(--text-color);font-family:"Press Start 2P",cursive}.custom-select-wrapper{height:32px;position:relative}.hidden-native-select{display:none!important}.custom-select-display{cursor:pointer;outline:none;justify-content:space-between;align-items:center;width:100%;display:flex}.custom-select-text{white-space:nowrap;text-overflow:ellipsis;padding-right:5px;overflow:hidden}.custom-select-arrow{padding-left:5px;font-size:12px;line-height:1}.custom-select-options{z-index:100;border-style:solid;border-width:1px;border-color:var(--border);background:var(--window-bg);width:100%;max-height:200px;margin-top:3px;position:absolute;top:100%;left:0;overflow-y:auto}.custom-select-option{cursor:pointer;white-space:nowrap;text-overflow:ellipsis;background:var(--input-bg);border-bottom:1px solid var(--border-dark);padding:6px;font-size:12px;overflow:hidden}.custom-select-option:last-child{border-bottom:none}.custom-select-option:hover,.custom-select-option.selected{background:var(--header-title);color:var(--border-light)}.custom-select-display:focus{box-shadow:0 0 0 1px var(--text-color) inset}@media (width<=768px){body{padding:10px}.container{max-width:100%}.conversion-row{grid-template-columns:1fr;gap:10px}.swap-button{order:-1;width:40px;height:32px;margin:0 auto;padding:0}.swap-button:active{padding:1px 0 0 1px}.category-tabs{justify-content:space-around}}.css-textarea{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);width:100%;min-height:500px;color:var(--text-color);resize:vertical;outline:none;padding:12px;font-family:"Press Start 2P",monospace;font-size:12px;line-height:1.4}.css-textarea:focus{box-shadow:0 0 0 1px var(--text-color) inset}.css-textarea::placeholder{color:var(--border-dark)}.css-textarea:read-only{background:var(--button-pressed)}.css-property{color:var(--header-title);font-weight:400}.css-value{color:#006400}.css-selector{color:#8b4513}.css-comment{color:var(--border-dark);font-style:italic}.css-punctuation{color:var(--text-color)}@media (width<=768px){body{padding:10px}.container{max-width:100%}.editor-grid{grid-template-columns:1fr;gap:15px}.controls{flex-direction:column;align-items:center}.btn{width:200px}.css-textarea{min-height:400px;padding:10px;font-size:12px}}@media (width<=480px){.css-textarea{min-height:300px;padding:8px;font-size:12px}}.btn:active,.btn-primary:active{border-color:var(--border);padding:7px 11px 5px 13px}select.btn{appearance:none;background-image:none;background:var(--button-face) url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"8\" viewBox=\"0 0 12 8\"><path fill=\"%23000000\" d=\"M6 8L0 0h12z\"/></svg>") no-repeat right 6px center;padding-right:20px}.csv-container{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);max-height:70vh;font-size:12px;overflow:auto}.csv-table{border-collapse:collapse;width:100%;font-family:"Press Start 2P",monospace}.csv-table th,.csv-table td{text-align:left;border-right:1px solid var(--border-dark);border-bottom:1px solid var(--border-dark);white-space:nowrap;text-overflow:ellipsis;background:var(--input-bg);max-width:200px;padding:6px 8px;overflow:hidden}.csv-table th{background:var(--button-pressed);z-index:1;color:var(--text-color);border-bottom:1px solid var(--border-dark);font-weight:400;position:sticky;top:0}.csv-table tr:hover td{background:var(--button-pressed)}.csv-table td:last-child,.csv-table th:last-child{border-right:none}.row-number{background:var(--button-pressed);color:var(--text-color);text-align:center;z-index:2;border-right:1px solid var(--border-dark);min-width:40px;font-weight:400;position:sticky;left:0}.csv-table th.row-number{z-index:3}.pagination{text-align:center;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;margin-top:15px;display:flex}.page-info{color:var(--text-color);border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);padding:6px;font-size:12px}@media (width<=768px){body{padding:10px}.container{max-width:100%}.controls{flex-direction:column;align-items:center}.btn,.btn-primary,select.btn{width:200px}.stats{flex-direction:column;gap:8px}.csv-table th,.csv-table td{max-width:120px;padding:4px 6px;font-size:12px}.search-box{flex-direction:column;align-items:stretch}.pagination{flex-direction:column;gap:8px}.drop-zone{padding:20px 15px}.drop-zone-text{font-size:12px}}@media (width<=480px){.csv-table th,.csv-table td{max-width:80px;padding:3px 4px;font-size:12px}}.main-grid{grid-template-columns:1fr 1fr;gap:15px;display:grid}.color-group{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);margin-bottom:15px;padding:10px}.color-group-header{justify-content:space-between;align-items:center;margin-bottom:8px;font-size:12px;font-weight:400;display:flex}.color-controls{align-items:center;gap:8px;display:flex}.color-preview{border-style:solid;border-width:1px;border-color:var(--border);cursor:pointer;width:32px;height:32px;display:block}.color-input{opacity:0;pointer-events:none;width:0;height:0;position:absolute}.hex-input{border-style:solid;border-width:1px;border-color:var(--border);text-align:center;background:var(--input-bg);width:80px;color:var(--text-color);padding:4px;font-family:"Press Start 2P",monospace;font-size:12px}.position-container{flex:1;align-items:center;gap:8px;display:flex}.position-slider{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);appearance:none;outline:none;flex:1;height:20px}.position-slider::-webkit-slider-track{background:var(--input-bg);border:none;height:14px}.position-slider::-webkit-slider-thumb{appearance:none;background:var(--header-title);border-style:solid;border-width:1px;border-color:var(--border);cursor:pointer;width:20px;height:20px}.position-slider::-moz-range-track{background:var(--input-bg);border:none;height:14px}.position-slider::-moz-range-thumb{background:var(--header-title);border-style:solid;border-width:1px;border-color:var(--border);cursor:pointer;border-radius:0;width:20px;height:20px}.position-value{color:var(--text-color);text-align:right;min-width:40px;font-size:12px}.control-row{gap:12px;margin-bottom:15px;display:flex}.control-group{flex:1}.control-label{margin-bottom:6px;font-size:12px;font-weight:400;display:block}.control-input{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);width:100%;color:var(--text-color);padding:4px;font-family:"Press Start 2P",cursive;font-size:12px}.control-input:focus{box-shadow:0 0 0 1px var(--text-color) inset}.control-input:disabled{background:var(--border-dark);color:var(--button-pressed)}.btn-remove{background:var(--error-color);color:var(--text-color);padding:4px 8px;font-size:12px}.btn-remove:active{padding:5px 7px 3px 9px}.button-row{flex-wrap:wrap;gap:8px;display:flex}.gradient-preview{border-style:solid;border-width:1px;border-color:var(--border);background:linear-gradient(51deg,#3f5d85 0%,#3ea145 100%);width:100%;height:300px;margin-bottom:15px}.css-output-container{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);word-break:break-all;padding:12px;font-family:"Press Start 2P",monospace;font-size:12px;line-height:1.4}.css-output-label{color:var(--text-color);margin-bottom:8px;font-size:12px}.copy-message{background:var(--text-color);color:var(--border-light);opacity:0;pointer-events:none;z-index:10;padding:4px 8px;font-size:12px;transition:opacity .3s;position:absolute;top:-30px;left:50%;transform:translate(-50%)}.copy-message.visible{opacity:1}.color-group-3{display:none}@media (width<=900px){.main-grid{grid-template-columns:1fr;gap:15px}.control-row{flex-direction:column;gap:8px}.color-controls{flex-wrap:wrap}.button-row{justify-content:center}}@media (width<=768px){body{padding:10px}.container{max-width:100%}}.custom-dropdown{width:100%;margin-bottom:15px;position:relative}.image-preview-container{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);margin:15px 0;padding:15px;display:none}.image-preview-container.visible{display:block}.preview-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:15px;margin-bottom:15px;display:grid}.preview-item{text-align:center;background:var(--window-bg);border-style:solid;border-width:1px;border-color:var(--border-dark);padding:10px}.preview-thumbnail{object-fit:cover;border:1px solid var(--border-dark);width:80px;height:80px;margin-bottom:8px}.preview-filename{color:var(--text-color);word-break:break-all;margin-bottom:4px;font-size:12px;line-height:1.2}.preview-size{color:var(--border-dark);margin-bottom:8px;font-size:12px}.progress-container{margin:15px 0;display:none}.progress-bar{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);width:100%;height:20px;overflow:hidden}.progress-fill{background:var(--header-title);width:0%;height:100%;transition:width .3s}.progress-text{text-align:center;color:var(--text-color);margin-top:5px;font-size:12px}.hidden,#conversionCanvas{display:none}@media (width<=768px){body{padding:10px}.container{max-width:100%}.preview-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:10px}.preview-thumbnail{width:60px;height:60px}}.metadata-section{background:var(--input-bg);border-style:solid;border-width:1px;border-color:var(--border);padding:15px}.metadata-group{margin-bottom:15px}.metadata-group:last-child{margin-bottom:0}.metadata-label{color:var(--text-color);background:var(--button-pressed);border-style:solid;border-width:1px;border-color:var(--border);margin-bottom:6px;padding:4px;font-size:12px;font-weight:400;display:block}.metadata-value{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);color:var(--text-color);word-break:break-all;padding:8px;font-family:"Press Start 2P",monospace;font-size:12px;line-height:1.4}.metadata-value.not-available{color:var(--border-dark);font-style:italic}@media (width<=768px){body{padding:10px}.container{max-width:100%}.controls{flex-direction:column;align-items:center}.btn{width:200px}.stats{flex-direction:column;gap:8px}.metadata-value{padding:6px;font-size:12px}.metadata-label{font-size:12px}.drop-zone{padding:20px 15px}.drop-zone-text{font-size:12px}}@media (width<=480px){.metadata-value{padding:5px;font-size:12px}.metadata-label{font-size:12px}}#image-preview-container{white-space:nowrap;border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);margin:15px 0;padding:8px;display:none;overflow-x:auto}#image-preview-container.visible{display:block}.image-preview-item{vertical-align:top;background:var(--window-bg);border-style:solid;border-width:1px;border-color:var(--border);flex-direction:column;align-items:center;width:130px;margin:0 4px;padding:8px;display:inline-flex;position:relative}.preview-image-wrapper{border-style:solid;border-width:1px;border-color:var(--border);background:#000;justify-content:center;align-items:center;width:100px;height:100px;margin-bottom:8px;display:flex;overflow:hidden}.preview-image{object-fit:contain;width:100%;height:100%;transition:transform .3s}.image-info{color:var(--text-color);text-overflow:ellipsis;white-space:nowrap;text-align:center;max-width:100%;margin-bottom:4px;font-size:12px;overflow:hidden}.controls-row{justify-content:center;gap:2px;width:100%;margin-bottom:4px;display:flex}.controls-row button{border-style:solid;border-width:1px;border-color:var(--border);background:var(--button-face);color:var(--text-color);cursor:pointer;box-shadow:none;flex-grow:1;padding:4px 6px;font-family:"Press Start 2P",cursive;font-size:12px;line-height:1;transition:none}.controls-row button:active{border-color:var(--border);padding:5px 5px 3px 7px}.delete-btn{background:var(--error-color)!important;color:var(--text-color)!important}.form-group{margin-bottom:15px}.form-label{color:var(--text-color);margin-bottom:8px;font-size:12px;font-weight:400;display:block}.select-input{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);width:100%;color:var(--text-color);appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"8\" viewBox=\"0 0 12 8\"><path fill=\"%23000000\" d=\"M6 8L0 0h12z\"/></svg>");background-position:right 6px center;background-repeat:no-repeat;outline:none;padding:6px 24px 6px 6px;font-family:"Press Start 2P",cursive;font-size:12px}.select-input:focus{box-shadow:0 0 0 1px var(--text-color) inset}.spin{animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=768px){body{padding:10px}.container{max-width:100%}.image-preview-item{width:110px}.preview-image-wrapper{width:80px;height:80px}.controls-row button{padding:3px 5px;font-size:12px}.image-info{font-size:12px}}@media (width<=480px){.image-preview-item{width:100px}.preview-image-wrapper{width:70px;height:70px}.controls-row button{padding:2px 4px;font-size:12px}}.js-textarea{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);width:100%;min-height:500px;color:var(--text-color);resize:vertical;outline:none;padding:12px;font-family:"Press Start 2P",monospace;font-size:12px;line-height:1.4}.js-textarea:focus{box-shadow:0 0 0 1px var(--text-color) inset}.js-textarea::placeholder{color:var(--border-dark)}.js-textarea:read-only{background:var(--button-pressed)}@media (width<=768px){body{padding:10px}.container{max-width:100%}.editor-grid{grid-template-columns:1fr;gap:15px}.controls{flex-direction:column;align-items:center}.btn{width:200px}.js-textarea{min-height:400px;padding:10px;font-size:12px}}@media (width<=480px){.js-textarea{min-height:300px;padding:8px;font-size:12px}}.search-box{align-items:center;gap:8px;margin-bottom:15px;display:flex}.search-input{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);color:var(--text-color);flex:1;padding:6px;font-family:"Press Start 2P",cursive;font-size:12px}.search-input:focus{box-shadow:0 0 0 1px var(--text-color) inset;outline:none}.search-input::placeholder{color:var(--border-dark)}.json-container{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);max-height:70vh;padding:15px;font-family:"Press Start 2P",monospace;font-size:12px;line-height:1.4;overflow:auto}.json-key{color:var(--header-title);font-weight:400}.json-string{color:#006400}.json-number{color:#8b4513}.json-boolean{color:purple}.json-null{color:gray}.json-punctuation{color:var(--text-color)}.json-line{margin:2px 0}.json-block{margin-left:16px}.collapsed+.json-block{display:none}.path-indicator{background:var(--button-pressed);border-style:solid;border-width:1px;border-color:var(--border);color:var(--text-color);margin-bottom:12px;padding:8px 12px;font-family:"Press Start 2P",monospace;font-size:12px}.highlight{color:var(--text-color);background:#ff0}@media (width<=768px){body{padding:10px}.container{max-width:100%}.controls{flex-direction:column;align-items:center}.btn{width:200px}.stats{flex-direction:column;gap:8px}.search-box{flex-direction:column;align-items:stretch}.drop-zone{padding:20px 15px}.drop-zone-text{font-size:12px}.json-container{padding:10px;font-size:12px}}@media (width<=480px){.json-container{padding:8px;font-size:12px}}.toolbar-content{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.view-toggle{border-style:solid;border-width:1px;border-color:var(--border);gap:0;display:flex;overflow:hidden}.toggle-btn{background:var(--button-face);cursor:pointer;color:var(--text-color);border:none;border-right:1px solid var(--border-dark);padding:8px 12px;font-size:12px;transition:none}.toggle-btn:last-child{border-right:none}.toggle-btn.active{background:var(--button-pressed);padding:9px 11px 7px 13px;font-weight:700}.toggle-btn:active:not(.active){background:var(--button-pressed);padding:9px 11px 7px 13px}.editor-section{grid-template-columns:1fr 1fr;gap:15px;margin-bottom:15px;display:grid}.editor-section.editor-only,.editor-section.preview-only{grid-template-columns:1fr}.editor-section.preview-only .editor-group:first-child,.editor-section.editor-only .editor-group:last-child{display:none}.editor-group{border-style:solid;border-width:1px;border-color:var(--border);background:var(--button-pressed);flex-direction:column;height:500px;padding:1px;display:flex}.editor-label{border-top:1px solid var(--border-dark);border-left:1px solid var(--border-dark);border-right:1px solid var(--border-light);border-bottom:1px solid var(--border-light);z-index:10;background:#fff;flex-shrink:0;margin-bottom:-1px;padding:6px 8px;font-size:12px;font-weight:400;display:inline-block;position:relative}.markdown-textarea{resize:none;background:var(--input-bg);width:100%;color:var(--text-color);border:1px solid;border-color:var(--border);outline:none;flex:1;margin-top:-1px;padding:15px;font-family:Monaco,Menlo,Courier New,monospace;font-size:12px;line-height:1.4}.markdown-textarea::placeholder{color:var(--border-dark);font-size:12px}.preview-container{background:var(--input-bg);border-style:solid;border-width:1px;border-color:var(--border);flex:1;margin-top:-1px;padding:15px;overflow-y:auto}.preview-container h1,.preview-container h2,.preview-container h3,.preview-container h4,.preview-container h5,.preview-container h6{color:var(--text-color);margin:12px 0 6px;font-family:"Press Start 2P",cursive}.preview-container h1{border-bottom:1px solid var(--border-dark);padding-bottom:4px;font-size:14px}.preview-container h2{border-bottom:1px solid var(--border-dark);padding-bottom:2px;font-size:12px}.preview-container h3,.preview-container h4,.preview-container h5,.preview-container h6{font-size:12px}.preview-container p{color:var(--text-color);margin:6px 0;font-size:12px;line-height:1.4}.preview-container ul,.preview-container ol{color:var(--text-color);margin:6px 0 6px 15px;font-size:12px}.preview-container li{margin:2px 0}.preview-container blockquote{border-left:1px solid var(--border-dark);background:var(--button-pressed);color:var(--text-color);margin:12px 0;padding:6px 12px;font-size:12px}.preview-container code{background:var(--button-pressed);border:1px solid var(--border-dark);color:var(--text-color);padding:2px 4px;font-family:Monaco,Menlo,Courier New,monospace;font-size:12px}.preview-container pre{background:var(--button-pressed);border:1px solid var(--border-dark);margin:12px 0;padding:12px;font-size:12px;overflow-x:auto}.preview-container pre code{color:inherit;background:0 0;border:none;padding:0}.preview-container table{border-collapse:collapse;width:100%;margin:12px 0;font-size:12px}.preview-container th,.preview-container td{border:1px solid var(--border-dark);text-align:left;color:var(--text-color);padding:6px 8px}.preview-container th{background:var(--button-pressed);font-weight:400}.preview-container a{color:var(--header-title);text-decoration:underline}.preview-container a:hover{background:var(--header-title);color:var(--border-light)}.preview-container img{border:1px solid var(--border-dark);max-width:100%;height:auto;margin:6px 0}.preview-container hr{background:var(--border-dark);border:none;height:2px;margin:15px 0}.stats-content{flex-wrap:wrap;gap:20px;font-size:12px;display:flex}.empty-state{text-align:center;color:var(--border-dark);padding:30px 15px;font-size:12px}@media (width<=768px){body{padding:10px}.container{max-width:100%}.editor-section{grid-template-columns:1fr;gap:12px}.editor-section.editor-only,.editor-section.preview-only{grid-template-columns:1fr}.editor-section.preview-only .editor-group:first-child,.editor-section.editor-only .editor-group:last-child{display:flex}.toolbar-content{flex-direction:column;align-items:stretch;gap:12px}.view-toggle{justify-content:center}.stats-content{flex-direction:column;gap:8px}.editor-group{height:400px}}.image-upload-area{text-align:center;margin-bottom:15px}.file-input-wrapper{margin-bottom:16px;display:inline-block;position:relative}.canvas-container{border-style:solid;border-width:1px;border-color:var(--border);background:var(--button-pressed);max-width:600px;min-height:300px;margin:0 auto;position:relative}.canvas-container.has-image{background:var(--input-bg)}.color-picker-canvas{cursor:crosshair;width:100%;height:auto;display:block}.image-placeholder{color:var(--text-color);text-align:center;pointer-events:none;padding:20px;font-size:12px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.picker-instruction{color:var(--success-color);margin-top:12px;font-size:12px;font-weight:400}.zoom-window{border-style:solid;border-width:1px;border-color:var(--border);background:var(--window-bg);pointer-events:none;z-index:1000;border-radius:50%;width:150px;height:150px;display:none;position:fixed;overflow:hidden}.zoom-canvas{width:100%;height:100%;display:block}.zoom-crosshair{width:12px;height:12px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.zoom-crosshair:before{content:"";background:var(--text-color);width:100%;height:2px;position:absolute;top:50%;left:0;transform:translateY(-50%)}.zoom-crosshair:after{content:"";background:var(--text-color);width:2px;height:100%;position:absolute;top:0;left:50%;transform:translate(-50%)}.color-input-area{flex-wrap:wrap;justify-content:center;align-items:center;gap:16px;display:flex}.color-input-label{color:var(--text-color);font-size:12px;font-weight:400}.color-picker-input{border:1px solid;border-color:var(--border);cursor:pointer;background:var(--input-bg);width:48px;height:48px;padding:0}.color-picker-input::-webkit-color-swatch-wrapper{padding:0}.color-picker-input::-webkit-color-swatch{border:none}.hex-input-wrapper{align-items:center;gap:4px;display:flex}.hex-prefix{color:var(--text-color);font-size:12px;font-weight:400}.hex-input{border:1px solid;border-color:var(--border);background:var(--input-bg);width:100px;color:var(--text-color);text-align:center;text-transform:uppercase;outline:none;height:32px;padding:6px;font-family:"Press Start 2P",monospace;font-size:12px;line-height:1}.hex-input:focus{box-shadow:0 0 0 1px var(--text-color) inset}.palette-container{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-top:15px;display:grid}.color-card{cursor:pointer;border-style:solid;border-width:1px;border-color:var(--border);flex-direction:column;justify-content:flex-end;height:120px;padding:12px;transition:none;display:flex}.color-card:active{border-color:var(--border);padding:13px 11px 11px 13px}.color-hex{margin-bottom:4px;font-family:"Press Start 2P",monospace;font-size:12px;font-weight:400}.color-label{opacity:.8;font-size:12px}.notification.error{background:var(--error-color)}@media (width<=768px){body{padding:10px}.container{max-width:100%}.canvas-container{max-width:100%;min-height:250px}.color-input-area{flex-direction:column;gap:12px}.palette-container{grid-template-columns:repeat(2,1fr);gap:12px}.color-card{height:100px;padding:10px}.color-hex{font-size:12px}.zoom-window{width:120px;height:120px}.zoom-crosshair{width:10px;height:10px}}@media (width<=480px){.palette-container{grid-template-columns:1fr}.zoom-window{width:100px;height:100px}.zoom-crosshair{width:8px;height:8px}}#pdf-preview-container{white-space:nowrap;border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);margin:15px 0;padding:8px;display:none;overflow-x:auto}#pdf-preview-container.visible{display:block}.pdf-preview-item{vertical-align:top;background:var(--window-bg);border-style:solid;border-width:1px;border-color:var(--border-dark);flex-direction:column;align-items:center;width:130px;margin:0 4px;padding:8px;display:inline-flex;position:relative}.preview-image-wrapper{border:1px solid var(--border-dark);background:#000;justify-content:center;align-items:center;width:100px;height:100px;margin-bottom:8px;display:flex;overflow:hidden}.preview-image{object-fit:contain;cursor:pointer;width:100%;height:100%}.page-info{color:var(--text-color);text-align:center;margin-bottom:4px;font-size:12px}.rotation-controls{justify-content:center;gap:2px;width:100%;margin-bottom:4px;display:flex}.rotation-controls button{border-style:solid;border-width:1px;border-color:var(--border);background:var(--button-face);color:var(--text-color);cursor:pointer;flex-grow:1;padding:4px 6px;font-size:12px;line-height:1;transition:none}.rotation-controls button:active{border-color:var(--border);padding:5px 5px 3px 7px}.btn-content{justify-content:center;align-items:center;gap:8px;width:100%;height:100%;display:flex}.btn:active:not(:disabled){border-color:var(--border);padding:13px 0 11px}.btn-icon{font-size:12px}.status-message{text-align:center;border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);color:var(--text-color);opacity:0;margin-top:15px;padding:12px 20px;font-size:12px;transition:opacity .3s}.status-message.visible{opacity:1}.status-message.error{background:var(--error-color);color:var(--text-color)}.status-message.info{background:var(--input-bg);color:var(--text-color)}.status-message.success{background:var(--success-color);color:var(--border-light)}#render-canvas{display:none}#loading-bar-container{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);box-sizing:content-box;width:100%;height:25px;margin-top:0;margin-bottom:0;padding:2px;display:none}#loading-bar-container.visible{display:block}.progress-bar{background-color:var(--window-bg);height:100%;display:flex;overflow:hidden}.progress-segment{background-color:navy;border-top:1px solid #4040ff;border-left:1px solid #4040ff;flex-shrink:0;width:10px;height:100%;margin-right:2px}.spin{display:none!important}.modal{z-index:2000;cursor:pointer;background:#000c;justify-content:center;align-items:center;width:100%;height:100%;display:none;position:fixed;top:0;left:0}.modal-content{object-fit:contain;border-style:solid;border-width:1px;border-color:var(--border);background:var(--window-bg);max-width:90%;max-height:90%;padding:8px}.modal-close{border-style:solid;border-width:1px;border-color:var(--border);background:var(--button-face);color:var(--text-color);cursor:pointer;z-index:2001;justify-content:center;align-items:center;width:40px;height:40px;font-family:"Press Start 2P",cursive;font-size:16px;display:flex;position:absolute;top:20px;right:20px}.modal-close:active{border-color:var(--border);padding:1px 0 0 1px}@media (width<=768px){body{padding:10px}.container{max-width:100%}.drop-zone{padding:20px 15px}.drop-zone-text{font-size:12px}.pdf-preview-item{width:110px}.preview-image-wrapper{width:80px;height:80px}}.back-button{background:var(--button-face);color:var(--text-color);border-style:solid;border-width:1px;border-color:var(--border);cursor:pointer;padding:4px 7px;font-size:12px;line-height:1;text-decoration:none}.back-button:active{border-color:var(--border);padding:5px 6px 3px 8px}.header{text-align:center;border-bottom:1px solid var(--border-dark);margin-bottom:27px;padding-bottom:18px}.header h1{color:var(--header-title);margin-bottom:9px;font-size:22px;font-weight:400}.header p{color:var(--text-color);opacity:.8;font-size:12px}.content-section{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);margin-bottom:23px;padding:14px}.section-title{color:var(--header-title);align-items:center;gap:7px;margin-bottom:11px;font-size:13px;font-weight:400;display:flex}.section-icon{font-size:14px}.content-text{margin-bottom:14px;font-size:12px;line-height:1.8}.content-text:last-child{margin-bottom:0}.privacy-list{margin:14px 0;padding-left:18px;list-style:none}.privacy-list li{margin-bottom:7px;font-size:12px;line-height:1.8;position:relative}.privacy-list li:before{content:"+";color:var(--accent-color);font-size:13px;position:absolute;left:-14px}.highlight-box{background:var(--success-color);color:#fff;border-style:solid;border-width:1px;border-color:var(--border);margin:14px 0;padding:11px;font-size:12px;line-height:1.6}.warning-box{background:var(--error-color);color:var(--text-color);border-style:solid;border-width:1px;border-color:var(--border);margin:14px 0;padding:11px;font-size:12px;line-height:1.6}.contact-section{background:var(--button-pressed);border-style:solid;border-width:1px;border-color:var(--border);text-align:center;margin-top:27px;padding:18px}.contact-title{color:var(--header-title);margin-bottom:9px;font-size:13px}.contact-text{margin-bottom:14px;font-size:12px;line-height:1.6}.contact-email{background:var(--input-bg);color:var(--accent-color);border-style:solid;border-width:1px;border-color:var(--border);padding:7px 11px;font-size:12px;text-decoration:none;display:inline-block}.contact-email:hover{background:var(--button-pressed)}.footer{text-align:center;border-top:1px solid var(--border-dark);color:var(--text-color);opacity:.7;margin-top:36px;padding-top:18px;font-size:12px}@media (width<=768px){body,.app-body{padding:14px}.header h1{font-size:18px}.section-title,.content-text,.privacy-list li{font-size:12px}}@media (width<=480px){body,.app-body{padding:9px}.title-bar{padding:5px 7px;font-size:13px}.back-button{padding:3px 5px;font-size:12px}}.input-field::placeholder{color:var(--border-dark);font-size:12px}.qr-container{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);justify-content:center;align-items:center;min-height:300px;margin-bottom:15px;padding:20px;display:flex}.qr-placeholder{color:var(--border-dark);text-align:center;padding:40px 20px;font-size:12px}#qrcode{justify-content:center;align-items:center;display:flex}#qrcode canvas{border-style:solid;border-width:1px;border-color:var(--border);background:#fff;padding:8px}.btn-primary:active{border-color:var(--border);padding:9px 14px 7px 16px}@media (width<=768px){body{padding:10px}.container{max-width:100%}.qr-container{min-height:250px;padding:15px}.controls{flex-direction:column;align-items:center;gap:8px}.btn{width:100%;max-width:200px}.input-field{font-size:12px}}.input-group{margin-bottom:15px}.input-label{color:var(--text-color);margin-bottom:6px;font-size:12px;font-weight:400;display:block}.regex-input-wrapper{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);align-items:center;display:flex}.regex-prefix{background:var(--button-pressed);border-right:1px solid var(--border-dark);color:var(--text-color);padding:6px 8px;font-family:"Press Start 2P",monospace;font-size:12px}.regex-input{background:var(--input-bg);color:var(--text-color);border:none;outline:none;flex:1;padding:6px 8px;font-family:"Press Start 2P",monospace;font-size:12px}.flags-container{border-left:1px solid var(--border-dark);background:var(--button-pressed);gap:8px;padding:6px 8px;display:flex}.flag-checkbox{color:var(--text-color);align-items:center;gap:3px;font-size:12px;display:flex}.flag-checkbox input{margin:0;transform:scale(.8)}.test-input{border-style:solid;border-width:1px;border-color:var(--border);resize:vertical;background:var(--input-bg);width:100%;min-height:120px;color:var(--text-color);outline:none;padding:8px;font-family:"Press Start 2P",monospace;font-size:12px;line-height:1.4}.test-input:focus{box-shadow:0 0 0 1px var(--text-color) inset}.test-input::placeholder{color:var(--border-dark)}.stat-value.success{color:var(--success-color)}.stat-value.error{color:#c00}.results-container{background:var(--input-bg);border-style:solid;border-width:1px;border-color:var(--border);margin-bottom:15px;padding:15px}.section-title{color:var(--text-color);background:var(--button-pressed);border-style:solid;border-width:1px;border-color:var(--border);margin-bottom:10px;padding:4px;font-size:12px;font-weight:400;display:inline-block}.highlighted-text{white-space:pre-wrap;word-wrap:break-word;background:var(--input-bg);border-style:solid;border-width:1px;border-color:var(--border);margin-bottom:15px;padding:8px;font-family:"Press Start 2P",monospace;font-size:12px;line-height:1.6}.match-highlight{background:var(--highlight-match);color:var(--text-color);padding:1px 2px}.matches-section{margin-bottom:15px}.match-item{background:var(--button-pressed);border-style:solid;border-width:1px;border-color:var(--border);margin-bottom:8px;padding:8px;font-family:"Press Start 2P",monospace;font-size:12px}.match-text{color:var(--success-color);margin-bottom:3px;font-weight:400}.match-details{color:var(--border-dark);font-size:12px}.groups-section{margin-bottom:15px}.group-item{border-style:solid;border-width:1px;border-color:var(--border);background:#e6f3ff;margin-bottom:6px;padding:6px 8px;font-family:"Press Start 2P",monospace;font-size:12px}.group-index{color:var(--header-title);font-weight:400}.examples{background:var(--input-bg);border-style:solid;border-width:1px;border-color:var(--border);padding:15px}.example-item{border-bottom:1px solid var(--border-dark);cursor:pointer;align-items:center;gap:8px;padding:6px 0;transition:none;display:flex}.example-item:hover{background:var(--button-pressed);margin:0 -8px;padding:6px 8px}.example-item:last-child{border-bottom:none}.example-regex{background:var(--button-pressed);border-style:solid;border-width:1px;border-color:var(--border);min-width:100px;padding:3px 6px;font-family:"Press Start 2P",monospace;font-size:12px}.example-description{color:var(--text-color);font-size:12px}@media (width<=768px){body{padding:10px}.container{max-width:100%}.controls{flex-direction:column;align-items:center}.btn{width:200px}.stats{flex-direction:column;gap:8px}.flags-container{flex-direction:column;gap:6px}.example-item{flex-direction:column;align-items:flex-start;gap:4px}.test-input{min-height:100px;font-size:12px}.highlighted-text{font-size:12px}}@media (width<=480px){.test-input,.highlighted-text,.match-item{font-size:12px}}.config-group{align-items:center;gap:8px;display:flex}.config-label{color:var(--text-color);white-space:nowrap;font-size:12px}.config-select{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);color:var(--text-color);appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"8\" viewBox=\"0 0 12 8\"><path fill=\"%23000000\" d=\"M6 8L0 0h12z\"/></svg>");background-position:right 6px center;background-repeat:no-repeat;min-width:120px;padding:6px 24px 6px 6px;font-family:"Press Start 2P",cursive;font-size:12px}.config-select:focus{box-shadow:0 0 0 1px var(--text-color) inset;outline:none}.file-input-label{border-style:solid;border-width:1px;border-color:var(--border);background:var(--button-face);color:var(--text-color);text-align:center;cursor:pointer;box-shadow:none;padding:6px 12px;font-size:12px;line-height:1;transition:none;display:inline-block}.editor-group{flex-direction:column;height:100%;display:flex}.editor-label{background:var(--button-pressed);border-bottom:1px solid var(--border-dark);color:var(--text-color);padding:8px;font-size:12px;font-weight:400}.sql-textarea{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);width:100%;min-height:500px;color:var(--text-color);resize:vertical;outline:none;padding:12px;font-family:"Press Start 2P",monospace;font-size:12px;line-height:1.4}.sql-textarea:focus{box-shadow:0 0 0 1px var(--text-color) inset}.sql-textarea::placeholder{color:var(--border-dark)}.output-container{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);width:100%;min-height:500px;position:relative}.output-content{white-space:pre-wrap;width:100%;height:100%;min-height:500px;color:var(--text-color);background:var(--input-bg);padding:12px;font-family:"Press Start 2P",monospace;font-size:12px;line-height:1.4;overflow:auto}.copy-button{border-style:solid;border-width:1px;border-color:var(--border);background:var(--success-color);color:var(--border-light);cursor:pointer;box-shadow:none;padding:4px 8px;font-size:12px;line-height:1;transition:none;position:absolute;bottom:8px;right:8px}.sql-keyword{color:var(--header-title);font-weight:400}.sql-string{color:#006400}.sql-number{color:#8b4513}.sql-comment{color:var(--border-dark);font-style:italic}.sql-operator{color:purple}.notification{background:var(--success-color);color:var(--border-light);border-style:solid;border-width:1px;border-color:var(--border);opacity:0;pointer-events:none;z-index:1000;padding:8px 15px;font-size:12px;transition:opacity .3s;position:fixed;bottom:20px;left:50%;transform:translate(-50%)}.notification.error{background:var(--error-color);color:var(--text-color)}.notification.show{opacity:1}@media (width<=768px){body{padding:10px}.container{max-width:100%}.editor-grid{grid-template-columns:1fr;gap:15px}.config-row{flex-direction:column;align-items:stretch;gap:10px}.config-group{justify-content:space-between}.config-select{flex:1;min-width:auto}.sql-textarea,.output-content{min-height:400px;padding:10px;font-size:12px}}@media (width<=480px){.sql-textarea,.output-content{min-height:300px;padding:8px;font-size:12px}.copy-button{padding:3px 6px;font-size:12px}}.file-input-section{flex-wrap:wrap;justify-content:center;gap:12px;margin-bottom:15px;display:flex}.file-input-label{border-style:solid;border-width:1px;border-color:var(--border);background:var(--button-face);color:var(--text-color);text-align:center;cursor:pointer;box-shadow:none;padding:6px 12px;font-family:"Press Start 2P",cursive;font-size:12px;line-height:1;transition:none;display:inline-block}.input-row{grid-template-columns:1fr 1fr;gap:15px;margin-bottom:15px;display:grid}.input-group{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);overflow:hidden}.input-label{background:var(--button-pressed);border-bottom:1px solid var(--border-dark);color:var(--text-color);padding:8px;font-size:12px;font-weight:400;display:block}.text-input{resize:vertical;background:var(--input-bg);width:100%;min-height:300px;color:var(--text-color);border:none;outline:none;padding:12px;font-family:"Press Start 2P",monospace;font-size:12px;line-height:1.4}.text-input:focus{box-shadow:0 0 0 1px var(--text-color) inset}.text-input::placeholder{color:var(--border-dark)}.stat-value.added{color:var(--success-color)}.stat-value.removed{color:#c00}.view-toggle{justify-content:center;gap:8px;margin-bottom:15px;display:flex}.toggle-btn{border-style:solid;border-width:1px;border-color:var(--border);background:var(--button-face);color:var(--text-color);text-align:center;cursor:pointer;box-shadow:none;padding:6px 12px;font-family:"Press Start 2P",cursive;font-size:12px;line-height:1;transition:none}.toggle-btn:active{border-color:var(--border);padding:7px 11px 5px 13px}.toggle-btn.active{background:var(--header-title);color:var(--border-light);border-color:var(--border);padding:7px 11px 5px 13px}.diff-container{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);margin-bottom:15px;overflow:hidden}.diff-header{background:var(--button-pressed);border-bottom:1px solid var(--border-dark);grid-template-columns:1fr 1fr;display:grid}.diff-title{color:var(--text-color);border-right:1px solid var(--border-dark);padding:8px;font-size:12px;font-weight:400}.diff-title:last-child{border-right:none}.diff-content{max-height:60vh;overflow:auto}.diff-view{grid-template-columns:1fr 1fr;display:grid}.diff-side{border-right:1px solid var(--border-dark);font-family:"Press Start 2P",monospace;font-size:12px;line-height:1.4}.diff-side:last-child{border-right:none}.diff-line{min-height:18px;display:flex}.line-number{background:var(--button-pressed);color:var(--text-color);border-right:1px solid var(--border-dark);text-align:right;-webkit-user-select:none;user-select:none;flex-shrink:0;min-width:35px;padding:2px 6px;font-size:12px}.line-content{white-space:pre-wrap;word-wrap:break-word;flex:1;padding:2px 6px}.line-added{background:var(--highlight-added);border-left:1px solid var(--success-color)}.line-removed{background:var(--highlight-removed);border-left:1px solid #c00}.line-modified{background:var(--highlight-modified);border-left:1px solid #ff8c00}.line-unchanged{background:var(--input-bg)}.unified-view{font-family:"Press Start 2P",monospace;font-size:12px;line-height:1.4}.no-diff{text-align:center;color:var(--success-color);padding:30px 15px;font-size:12px}@media (width<=768px){body{padding:10px}.container{max-width:100%}.input-row{grid-template-columns:1fr;gap:15px}.diff-view{grid-template-columns:1fr}.diff-side{border-right:none;border-bottom:1px solid var(--border-dark)}.diff-side:last-child{border-bottom:none}.controls{flex-direction:column;align-items:center}.btn{width:180px}.stats{flex-direction:column;gap:8px}.diff-header{grid-template-columns:1fr}.diff-title{border-right:none;border-bottom:1px solid var(--border-dark)}.diff-title:last-child{border-bottom:none}.file-input-section{flex-direction:column;align-items:center}.file-input-label{width:180px}}@media (width<=480px){.text-input{min-height:250px;padding:10px;font-size:12px}.diff-side{font-size:12px}.line-number{min-width:30px;padding:1px 4px;font-size:12px}.line-content{padding:1px 4px}}.config-group{flex-direction:column;flex:1;gap:6px;min-width:120px;display:flex}.config-label{color:var(--text-color);font-size:12px;font-weight:400}.config-input{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);color:var(--text-color);outline:none;padding:6px 12px;font-family:"Press Start 2P",cursive;font-size:12px}.config-input:focus{box-shadow:0 0 0 1px var(--text-color) inset}.custom-dropdown{width:100%;position:relative}.dropdown-selected{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);width:100%;color:var(--text-color);cursor:pointer;-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;padding:6px 30px 6px 12px;font-family:"Press Start 2P",cursive;font-size:12px;display:flex}.dropdown-selected:hover{background:var(--button-pressed)}.dropdown-arrow{color:var(--text-color);pointer-events:none;font-size:12px;position:absolute;top:50%;right:8px;transform:translateY(-50%)}.dropdown-options{background:var(--input-bg);border-style:solid;border-width:1px;border-color:var(--border);z-index:100;max-height:200px;display:none;position:absolute;top:100%;left:0;right:0;overflow-y:auto}.dropdown-options.show{display:block}.dropdown-option{cursor:pointer;border-bottom:1px solid var(--border-dark);background:var(--input-bg);color:var(--text-color);padding:8px;font-size:12px}.dropdown-option:last-child{border-bottom:none}.dropdown-option:hover{background:var(--button-pressed)}.dropdown-option.selected{background:var(--header-title);color:var(--border-light)}.generate-button{border-style:solid;border-width:1px;border-color:var(--border);background:var(--header-title);color:var(--border-light);text-align:center;cursor:pointer;box-shadow:none;align-self:end;padding:8px 16px;font-family:"Press Start 2P",cursive;font-size:12px;line-height:1;transition:none}.generate-button:active{border-color:var(--border);padding:9px 15px 7px 17px}.output-container{position:relative}.output-header{background:var(--button-pressed);border-bottom:1px solid var(--border-dark);color:var(--text-color);justify-content:space-between;align-items:center;padding:8px;font-size:12px;font-weight:400;display:flex}.output-textarea{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);width:100%;min-height:400px;color:var(--text-color);resize:vertical;outline:none;padding:12px;font-family:"Press Start 2P",monospace;font-size:12px;line-height:1.4}.output-textarea:read-only{background:var(--button-pressed)}.output-textarea::placeholder{color:var(--border-dark)}.copy-button{border-style:solid;border-width:1px;border-color:var(--border);background:var(--success-color);color:var(--border-light);text-align:center;cursor:pointer;box-shadow:none;padding:6px 12px;font-family:"Press Start 2P",cursive;font-size:12px;line-height:1;transition:none}@media (width<=768px){body{padding:10px}.container{max-width:100%}.config-row{flex-direction:column;align-items:stretch;gap:12px}.config-group{width:100%;min-width:auto}.config-input,.generate-button,.copy-button{width:100%}.output-textarea{min-height:300px;padding:10px;font-size:12px}}@media (width<=480px){.output-textarea{min-height:250px;padding:8px;font-size:12px}}.current-time-section{text-align:center;padding:15px}#live-timestamp{color:var(--header-title);margin-bottom:8px;font-family:"Press Start 2P",monospace;font-size:14px;font-weight:400;display:block}#live-datetime{color:var(--text-color);margin-bottom:12px;font-size:12px;display:block}.set-current-btn{border-style:solid;border-width:1px;border-color:var(--border);background:var(--button-face);color:var(--text-color);text-align:center;cursor:pointer;box-shadow:none;padding:6px 12px;font-family:"Press Start 2P",cursive;font-size:12px;line-height:1;transition:none}.set-current-btn:active{border-color:var(--border);padding:7px 11px 5px 13px}.input-grid{grid-template-columns:2fr 1fr auto;align-items:end;gap:15px;display:grid}.input-group{flex-direction:column;display:flex}.input-label{color:var(--text-color);margin-bottom:6px;font-size:12px;font-weight:400}.timestamp-input,.format-select{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);width:100%;color:var(--text-color);outline:none;padding:8px;font-family:"Press Start 2P",cursive;font-size:12px}.timestamp-input:focus,.format-select:focus{box-shadow:0 0 0 1px var(--text-color) inset}.format-select{appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"8\" viewBox=\"0 0 12 8\"><path fill=\"%23000000\" d=\"M6 8L0 0h12z\"/></svg>");background-position:right 6px center;background-repeat:no-repeat;padding-right:24px}.convert-btn{border-style:solid;border-width:1px;border-color:var(--border);background:var(--header-title);color:var(--border-light);text-align:center;cursor:pointer;box-shadow:none;white-space:nowrap;padding:8px 12px;font-family:"Press Start 2P",cursive;font-size:12px;line-height:1;transition:none}.convert-btn:active{border-color:var(--border);padding:9px 11px 7px 13px}.output-section{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:15px;display:grid}.output-group{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);padding:12px}.output-label{color:var(--text-color);justify-content:space-between;align-items:center;margin-bottom:8px;font-size:12px;font-weight:400;display:flex}.output-value{color:var(--header-title);word-break:break-all;white-space:pre-wrap;background:0 0;min-height:20px;font-family:"Press Start 2P",monospace;font-size:12px;line-height:1.4}.copy-btn{border-style:solid;border-width:1px;border-color:var(--border);background:var(--button-face);color:var(--text-color);cursor:pointer;box-shadow:none;padding:3px 6px;font-family:"Press Start 2P",cursive;font-size:12px;line-height:1;transition:none}.copy-btn:active{border-color:var(--border);padding:4px 5px 2px 7px}@media (width<=768px){body{padding:10px}.container{max-width:100%}.input-grid,.output-section{grid-template-columns:1fr;gap:10px}.timestamp-input,.format-select,.convert-btn{padding:6px;font-size:12px}}@media (width<=480px){.output-value{font-size:12px}.copy-btn{padding:2px 4px;font-size:12px}#live-timestamp,#live-datetime{font-size:12px}}.xml-container{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);max-height:70vh;padding:15px;font-family:"Press Start 2P",monospace;font-size:12px;line-height:1.4;overflow:auto}.xml-node{margin-left:12px}.xml-element{margin:2px 0}.xml-tag{color:var(--xml-tag)}.xml-attribute{color:var(--xml-attribute)}.xml-text{color:var(--text-color);margin-left:6px}.xml-comment{color:var(--xml-comment);font-style:italic}.collapsible{cursor:pointer;position:relative}.collapsible:before{content:"▼";color:var(--text-color);width:8px;font-size:12px;position:absolute;left:-10px}.collapsible.collapsed:before{content:"▶"}.collapsed+.xml-node{display:none}.stats{background:var(--input-bg);border-style:solid;border-width:1px;border-color:var(--border);flex-wrap:wrap;gap:20px;margin-bottom:15px;padding:12px;font-size:12px;display:flex}.stat-item{color:var(--text-color)}.stat-value{color:var(--header-title);font-weight:400}@media (width<=768px){body{padding:10px}.container{max-width:100%}.controls{flex-direction:column;align-items:center}.btn{width:200px}.stats{flex-direction:column;gap:8px}.xml-container{padding:10px;font-size:12px}.xml-node{margin-left:8px}.drop-zone{padding:20px 15px}.drop-zone-text{font-size:12px}}@media (width<=480px){.xml-container{padding:8px;font-size:12px}.xml-node{margin-left:6px}}.config-row{flex-wrap:wrap;align-items:flex-end;gap:15px;margin-bottom:15px;display:flex}.config-group{flex-direction:column;gap:6px;display:flex}.config-label{color:var(--text-color);margin-bottom:6px;font-size:12px;font-weight:400}.config-select{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);color:var(--text-color);appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"8\" viewBox=\"0 0 12 8\"><path fill=\"%23000000\" d=\"M6 8L0 0h12z\"/></svg>");background-position:right 6px center;background-repeat:no-repeat;outline:none;height:32px;padding:6px 24px 6px 12px;font-family:"Press Start 2P",cursive;font-size:12px}.config-select:focus{box-shadow:0 0 0 1px var(--text-color) inset}.file-input-wrapper{display:inline-block;position:relative}.file-input{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute}.file-input-label{border-style:solid;border-width:1px;border-color:var(--border);background:var(--button-face);color:var(--text-color);text-align:center;cursor:pointer;box-shadow:none;box-sizing:border-box;height:32px;padding:6px 12px;font-family:"Press Start 2P",cursive;font-size:12px;line-height:1;transition:none;display:inline-block}.file-input-label:active{border-color:var(--border);padding:7px 11px 5px 13px}.config-button{margin-top:18px}.editor-grid{grid-template-columns:1fr 1fr;gap:15px;margin-bottom:15px;display:grid}.editor-group{flex-direction:column;display:flex}.editor-label{background:var(--button-pressed);border-bottom:1px solid var(--border-dark);color:var(--text-color);justify-content:space-between;align-items:center;padding:8px;font-size:12px;font-weight:400;display:flex}.yaml-textarea{border-style:solid;border-width:1px;border-color:var(--border);background:var(--input-bg);width:100%;min-height:400px;color:var(--text-color);resize:vertical;outline:none;padding:12px;font-family:"Press Start 2P",monospace;font-size:12px;line-height:1.4}.yaml-textarea:focus{box-shadow:0 0 0 1px var(--text-color) inset}.yaml-textarea::placeholder{color:var(--border-dark)}.yaml-textarea:read-only{background:var(--button-pressed)}.copy-button-wrapper{position:relative}.copy-button{border-style:solid;border-width:1px;border-color:var(--border);background:var(--success-color);color:var(--border-light);cursor:pointer;box-shadow:none;z-index:10;padding:4px 8px;font-family:"Press Start 2P",cursive;font-size:12px;line-height:1;transition:none;position:absolute;bottom:8px;right:8px}.copy-button:active{border-color:var(--border);padding:5px 7px 3px 9px}.copy-button:disabled{background:var(--border-dark);color:var(--button-pressed);cursor:not-allowed}.copy-button:disabled:active{border-color:var(--border);padding:4px 8px}.error-output{background:var(--error-color);color:var(--text-color)}.hidden{display:none}@media (width<=768px){body{padding:10px}.container{max-width:100%}.editor-grid{grid-template-columns:1fr;gap:15px}.config-row{flex-direction:column;align-items:stretch;gap:12px}.config-group,.config-select,.file-input-label,.btn{width:100%}.yaml-textarea{min-height:300px;padding:10px;font-size:12px}}@media (width<=480px){.yaml-textarea{min-height:250px;padding:8px;font-size:12px}.copy-button{padding:3px 6px;font-size:12px}.copy-button:active{padding:4px 5px 2px 7px}}