.mime-list{display:grid;gap:8px}.mime-item{display:grid;grid-template-columns:90px minmax(150px,1fr) minmax(180px,1.4fr);align-items:center;gap:10px;padding:11px 13px;border:1px solid #e1e5e9;border-radius:9px;background:#fff}.mime-item b{color:#56657a;font:13px Consolas,monospace}.mime-item strong{color:#45505e;font:12px Consolas,monospace}.mime-item span{color:#8a939f;font-size:12px}.chmod-grid{display:grid;grid-template-columns:100px repeat(3,1fr);gap:8px}.chmod-grid>*{min-height:42px;display:grid;place-items:center;padding:8px;border-radius:8px;background:#f3f6f8;color:#5e6977;font-size:12px}.chmod-grid strong{background:#56657a;color:#fff}.chmod-grid input{accent-color:#56657a}.chmod-result{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.chmod-result div{padding:15px;border-radius:10px;background:#eef2f5;text-align:center}.chmod-result span,.chmod-result strong{display:block}.chmod-result span{color:#8b939f;font-size:12px}.chmod-result strong{margin-top:5px;color:#45505e;font:18px Consolas,monospace}.key-stage{min-height:240px;display:grid;place-items:center;padding:25px;border:2px dashed #cfd8e2;border-radius:14px;outline:0;background:#f7f9fb;text-align:center}.key-stage.is-active{border-color:#56657a;background:#edf2f6}.key-stage b{display:block;color:#344050;font-size:42px}.key-stage span{display:block;margin-top:8px;color:#8b949f;font-size:12px}.key-properties{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.key-properties div{padding:12px;border-radius:9px;background:#f3f6f8}.key-properties span,.key-properties strong{display:block}.key-properties span{color:#8a939f;font-size:12px}.key-properties strong{margin-top:5px;color:#46515f;font:13px Consolas,monospace}.key-history{display:grid;gap:7px}.key-history div{display:grid;grid-template-columns:70px 1fr 1fr;gap:8px;padding:9px 11px;border:1px solid #e2e6ea;border-radius:8px;font-size:12px}.og-preview{overflow:hidden;border:1px solid #dfe4e9;border-radius:13px;background:#fff;box-shadow:0 12px 32px rgba(39,52,70,.08)}.og-image{height:250px;display:grid;place-items:center;overflow:hidden;color:#fff;background:linear-gradient(135deg,#168f78,#2267a9);font-size:42px}.og-image img{width:100%;height:100%;object-fit:cover}.og-content{padding:15px}.og-content small,.og-content strong,.og-content span{display:block}.og-content small{color:#8a939f;font-size:12px;text-transform:uppercase}.og-content strong{margin-top:6px;color:#2f3947;font-size:17px}.og-content span{margin-top:7px;color:#707b88;font-size:12px;line-height:1.6}.sql-output{width:100%;height:500px;display:block;resize:vertical;padding:18px;color:#dce5ef;border:0;outline:0;background:#2b3441;font:13px/1.75 Consolas,monospace}
@media(max-width:700px){.mime-item{grid-template-columns:75px 1fr}.mime-item span{grid-column:1/-1}.chmod-grid{grid-template-columns:75px repeat(3,1fr)}.chmod-result,.key-properties{grid-template-columns:1fr}.key-history div{grid-template-columns:55px 1fr}.key-history div span:last-child{grid-column:1/-1}}