.app{width:720px;margin:0 auto;padding:2rem}.subtitle{color:#888;margin-top:-.5em}.file-picker{display:flex;align-items:center;gap:.75rem;margin-bottom:1.5rem}.file-picker label{white-space:nowrap;color:#aaa}.tabs{display:flex;gap:.5rem}.tabs button{flex:1;padding:.5em 1em;border:1px solid #444;border-radius:6px 6px 0 0;background:transparent;color:#aaa;cursor:pointer;font-size:.95em;transition:background .15s,color .15s}.tabs button:hover{background:#2a2a2a;color:#ddd}.tabs button.active{border-color:#646cff;background-color:#646cff;color:#fff}.tab-content{text-align:left}.tab-panel{height:500px;overflow-y:auto;text-align:left;border:1px solid #333;border-radius:0 0 6px 6px;padding:0 1rem 1rem}.error{background:#3a1a1a;border:1px solid #a33;color:#faa;border-radius:8px;padding:.75em 1em;margin-bottom:1rem}.loading{color:#888;white-space:nowrap}.file-meta{margin-top:.75rem;margin-bottom:.5rem}.section{margin-top:1.25rem}.section:first-child{margin-top:.5rem}.section-title{margin:0 0 .5rem;font-size:1.1em;border-bottom:1px solid #333;padding-bottom:.25rem}.sections-grid{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;align-items:start;gap:0 2rem;margin-top:.5rem}.properties-table{width:100%;border-collapse:collapse;font-size:.9em}.properties-table td{padding:.2em .5em;vertical-align:top}.prop-name{white-space:nowrap;color:#aaa;width:1%}.prop-value{white-space:pre-wrap}.prop-value code{font-family:Cascadia Code,Fira Code,Consolas,monospace;font-size:.95em}.bool-true{color:#6c6}.bool-false{color:#c66}.colour-value{display:inline-flex;align-items:center;gap:.4em}.colour-swatch{display:inline-block;width:14px;height:14px;border-radius:3px;border:1px solid #555;vertical-align:middle}.items-list{display:flex;flex-direction:column;gap:.25rem}.item{background:#1a1a1a;border:1px solid #333;border-radius:6px;padding:.5em .75em}.item-header{display:flex;align-items:baseline;gap:.4em;font-weight:500}.item-index{color:#666;min-width:1.5em;text-align:right}.item-title{font-weight:600}.item .properties-table{margin-top:.25em;margin-left:1.9em}.empty-note{color:#666;font-style:italic;margin:.25em 0}.item-nested-summary{cursor:pointer;display:flex;align-items:baseline;gap:.4em;font-weight:500;-webkit-user-select:none;user-select:none}.item-nested-arrow{display:inline-block;transition:transform .15s;color:#888}.item-nested--open .item-nested-arrow{transform:rotate(90deg)}.item-inline-props{color:#888;font-weight:400;font-size:.9em;margin-left:.5em}.item-nested-content{margin-top:.5em;margin-left:1.5em}.details-expander{margin-top:.25em;margin-left:1.9em}.details-expander-summary{cursor:pointer;color:#888;font-size:.85em;-webkit-user-select:none;user-select:none}.details-expander-arrow{display:inline-block;transition:transform .15s}.details-expander--open .details-expander-arrow{transform:rotate(90deg)}.convert-hint{color:#aaa;margin:.75rem 0}.convert-buttons{display:flex;flex-wrap:wrap;gap:.5rem}.convert-button{padding:.4em 1em;border-radius:6px;border:1px solid #444;background:#2a2a2a;color:inherit;font-size:.9em;cursor:pointer;transition:background .15s,border-color .15s}.convert-button:hover:not(:disabled){background:#3a3a3a;border-color:#646cff}.convert-button:disabled{opacity:.5;cursor:not-allowed}.converting-message{color:#888;font-style:italic;margin-top:.75rem}.convert-error{color:#e74c3c;margin-top:.75rem}@media(prefers-color-scheme:light){.file-picker label{color:#666}.tabs button{border-color:#ccc;color:#666}.tabs button:hover{background:#f0f0f0;color:#333}.tabs button.active{border-color:#646cff;background-color:#646cff;color:#fff}.section-title{border-bottom-color:#ddd}.item{background:#f5f5f5;border-color:#ddd}.prop-name{color:#666}.colour-swatch{border-color:#ccc}.convert-hint{color:#666}.convert-button{background:#f0f0f0;border-color:#ccc}.convert-button:hover:not(:disabled){background:#e0e0e0;border-color:#646cff}.error{background:#fee;border-color:#c33;color:#a00}}.app{width:100%;margin:0;padding:0 .8rem}.tab-panel{height:calc(100vh - 18rem);min-height:200px}article:has(>#oakio-converter){padding:0;margin:0}article:has(>#oakio-converter)>*:not(#oakio-converter){padding-left:.8rem;padding-right:.8rem}