3 lines
5.9 KiB
CSS
3 lines
5.9 KiB
CSS
:root{font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;color:#253d45;background:#f3f2eb;line-height:1.5;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit;color:inherit}button,a.button{border:1px solid #c9d1c8;background:#fbfcf7;border-radius:10px;min-height:42px;padding:9px 14px;cursor:pointer;font-size:13px;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}button:hover,a.button:hover{background:#e7ece3}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #e6a63d;outline-offset:3px}a{color:#366c67;text-underline-offset:3px}.primary,a.button.primary{color:#fff;background:#396f67;border-color:#396f67}.primary:hover,a.button.primary:hover{background:#2c5d55}.page-header,main{max-width:1440px;margin:auto;padding:36px 40px}.page-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:18px;gap:24px}.page-header h1{font-size:44px;letter-spacing:-2px;margin:3px 0}.page-header p{margin:4px 0;color:#647773;font-size:14px}.eyebrow{font-size:11px!important;letter-spacing:2px;font-weight:700;color:#71887e;text-transform:uppercase}main{padding-top:12px}.summary{padding:18px 20px;border:1px solid #d3dbcd;background:#e8ece2;border-radius:12px;font-size:13px;margin-bottom:26px}.controls{display:flex;gap:16px;flex-wrap:wrap;align-items:end}.controls>label{min-width:150px}.controls>label:first-child{flex:1;min-width:250px}label{display:flex;flex-direction:column;gap:7px;font-size:12px;font-weight:650}select,input{background:#fbfcf7;border:1px solid #c9d1c8;border-radius:8px;min-height:42px;padding:9px 12px;width:100%;font-size:13px}.controls form{display:flex;gap:8px;align-items:end}.controls form input{max-width:110px}.chapter-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:34px 0 20px}.chapter-heading p{margin:0}.chapter-heading h2{font-size:26px;margin:4px 0}nav{display:flex;gap:8px}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.card{display:block;text-align:left;background:#fafbf6;border:1px solid #d8ddd2;border-radius:15px;padding:12px;cursor:pointer;min-width:0;transition:transform .15s}.card:hover{transform:translateY(-3px)}.card canvas{width:100%;aspect-ratio:1;height:auto;display:block;border-radius:9px;background:#dce3d8}.card-meta{display:flex;justify-content:space-between;gap:6px;align-items:center;margin-top:12px;font-size:11px;color:#71827a}.card-meta strong{font-size:13px;color:#39584e}.card h3{font-size:15px;margin:5px 0 4px;color:#2e4841}.card p{font-size:11px;margin:4px 0;color:#6d7c71}.badge{border-radius:20px;padding:3px 8px;background:#e7ecdf;color:#5d7059;font-size:10px}.card [data-tier="4"],.card [data-tier="5"]{background:#f0e0cd;color:#976139}.footnote{font-size:12px;color:#78867c;margin:28px 0;max-width:900px}dialog{width:min(1100px,calc(100% - 30px));max-height:92dvh;border:1px solid #d1dbce;border-radius:20px;padding:28px;color:#253d45;background:#f8f9f2}dialog::backdrop{background:#243d45aa;backdrop-filter:blur(4px)}.close{position:absolute;right:16px;top:16px;border:0;font-size:24px;width:42px}.detail-heading{padding-right:34px}.detail-heading h2{font-size:26px;margin:5px 0}.detail-heading>p:last-child{font-size:14px;max-width:720px;color:#688072}.detail-columns{display:grid;grid-template-columns:1.2fr 1fr;gap:30px}.detail-columns canvas{display:block;width:100%;height:auto;aspect-ratio:1;border-radius:12px;background:#dce3d8}.replay-controls{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}#replay-status{font-size:12px;color:#567466;min-height:36px}.track-toggle{display:flex;flex-direction:row;align-items:center;font-weight:400;font-size:12px;color:#6b7d70}.track-toggle input{width:18px;min-height:18px;margin:0}.detail-metrics{display:grid;grid-template-columns:1fr 1fr;gap:10px}.detail-metrics>div{background:#e9eee1;border-radius:10px;padding:13px}.detail-metrics span{display:block;color:#70866f;font-size:11px}.detail-metrics strong{font-size:19px;font-weight:650;display:block;margin-top:3px}.hint{font-size:12px;color:#70826f}.replay-actions{font-size:12px;line-height:1.8;max-height:240px;overflow:auto;padding-left:29px}.replay-actions li{padding:3px 8px;border-radius:5px}.replay-actions li.active{background:#d9e6d1;color:#2e6546}.detail-links{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}details{font-size:12px}summary{cursor:pointer;padding:10px 0}pre{font:11px/1.6 monospace;overflow:auto;max-height:220px;padding:12px;background:#e9eee1;border-radius:8px}#empty{padding:70px 20px;text-align:center;color:#73816f}[hidden]{display:none!important}@media(min-width:1400px){.grid{grid-template-columns:repeat(5,minmax(0,1fr))}}@media(max-width:1000px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}.page-header,main{padding-left:24px;padding-right:24px}}@media(max-width:700px){.page-header,main{padding-left:16px;padding-right:16px}.page-header{align-items:start}.page-header h1{font-size:33px}.page-header p{font-size:12px}.page-header .button{white-space:nowrap;padding:8px 11px}.controls{gap:12px}.controls>label{min-width:0;flex:1}.controls>label:first-child{flex-basis:100%;min-width:0}.controls form{width:100%}.controls form label{flex:1}.controls form input{max-width:none}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.card{padding:8px}.card h3{font-size:13px}.card-meta{font-size:10px}.card p{font-size:10px}.chapter-heading{align-items:start}.chapter-heading h2{font-size:21px}.chapter-heading nav{gap:5px}.chapter-heading button{padding:8px;font-size:11px}.detail-columns{grid-template-columns:1fr;gap:20px}dialog{padding:20px 15px}.detail-heading h2{font-size:23px}.detail-heading>p:last-child{font-size:12px}.detail-metrics strong{font-size:17px}.summary{padding:15px;font-size:12px}}
|
|
@media(max-width:700px){.chapter-heading{flex-wrap:wrap}.chapter-heading nav{width:100%;justify-content:space-between}.chapter-heading #export-sheet{margin-right:auto}}
|