.tr-app{font-family:system-ui,-apple-system,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;color:#17314b;background:#e8eafe}.tr-app, .tr-app *{box-sizing:border-box}.tr-app{margin:0;min-height:100dvh;background:linear-gradient(125deg,#8c8bdf,#5c91dd)}.tr-app button, .tr-app input, .tr-app select{font:inherit}.tr-app button{cursor:pointer}.tr-app .shell{min-height:100dvh;display:flex;flex-direction:column}.tr-app .head{background:#172d4b;color:white;display:flex;align-items:center;gap:16px;padding:10px clamp(12px,3vw,30px)}.tr-app .brand{font-weight:900;font-size:clamp(19px,2.3vw,28px);white-space:nowrap}.tr-app .head small{font-weight:700;opacity:.78}.tr-app .head button{margin-left:auto;border:1px solid #69809c;border-radius:10px;padding:9px 13px;background:#263f61;color:white;font-weight:800}.tr-app .card{width:min(1200px,calc(100% - 24px));margin:16px auto;padding:clamp(13px,2vw,24px);border-radius:22px;background:#fff;box-shadow:0 16px 45px #1b316055;flex:1}.tr-app .top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.tr-app .eyebrow{color:#627993;font-size:12px;font-weight:800}.tr-app .top h1{font-size:clamp(22px,3vw,34px);margin:3px 0}.tr-app .source{font-size:12px;color:#52687c}.tr-app .year{font-size:clamp(32px,5vw,60px);font-weight:950;line-height:1;color:#255592;white-space:nowrap}.tr-app .controls{margin:16px 0 10px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}.tr-app .controls button, .tr-app .controls select, .tr-app .upload{border:1px solid #cbd9ea;border-radius:12px;background:#f4f8ff;color:#1c3d63;padding:9px 12px;font-weight:800;min-height:42px}.tr-app .controls button[aria-pressed="true"]{background:#1b4e94;color:white}.tr-app .controls .primary{background:#2157a5;color:#fff;min-width:96px}.tr-app .controls label{font-size:12px;font-weight:800;color:#52687c}.tr-app .timeline{display:flex;align-items:center;gap:10px;margin-bottom:12px}.tr-app .timeline input{flex:1;accent-color:#235bb6;min-width:0;height:30px}.tr-app .timeline span{font-size:12px;font-weight:850;color:#52687c}.tr-app .chart{position:relative;min-height:590px;border-top:1px solid #e0e8f0;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(25% - 1px),#eaf0f5 calc(25% - 1px),#eaf0f5 25%);overflow:hidden}.tr-app .row{position:absolute;left:0;right:0;height:37px;display:grid;grid-template-columns:38px minmax(75px,136px) minmax(60px,1fr) minmax(112px,175px);gap:10px;align-items:center;transition:transform .65s ease,opacity .35s ease;will-change:transform}.tr-app .rank{font-weight:900;text-align:right;color:#61758a}.tr-app .name{font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tr-app .track{height:30px}.tr-app .bar{height:100%;border-radius:6px;min-width:2px;transition:width .65s ease;box-shadow:inset 0 -3px #10426a1a}.tr-app .value{text-align:right;font-weight:900;font-variant-numeric:tabular-nums;white-space:nowrap;font-size:clamp(11px,1.3vw,15px)}.tr-app .note{font-size:12px;color:#597087;line-height:1.6;margin:12px 0 0}.tr-app .message{color:#aa2944;min-height:1.4em;font-size:13px;font-weight:800}.tr-app .import-box{border:1px solid #d6e2ef;border-radius:14px;background:#f8fbff;padding:14px;margin:12px 0;display:none}.tr-app .import-box.open{display:block}.tr-app .import-box h2{font-size:17px;margin:0 0 8px}.tr-app .import-box p{font-size:12px;line-height:1.6;margin:6px 0}.tr-app .import-box code{font-size:12px}.tr-app .import-box input:not([type=file]){width:min(220px,100%);border:1px solid #cbd9ea;border-radius:8px;padding:8px}.tr-app .import-grid{display:flex;gap:8px;flex-wrap:wrap;align-items:end}.tr-app .import-grid label{display:grid;gap:4px;font-size:12px;font-weight:800}.tr-app .import-box input[type=file]{max-width:100%;font-size:12px}.tr-app .hidden{display:none!important}.tr-app :focus-visible{outline:3px solid #ffbc45;outline-offset:2px}@media(max-width:650px){.tr-app .head small{display:none}.tr-app .top{align-items:center}.tr-app .top h1{font-size:20px}.tr-app .source{max-width:210px}.tr-app .year{font-size:30px}.tr-app .row{grid-template-columns:25px minmax(60px,82px) minmax(38px,1fr) 112px;gap:5px;height:35px}.tr-app .name, .tr-app .rank, .tr-app .value{font-size:11px}.tr-app .value{font-size:10px;letter-spacing:-.02em}.tr-app .chart{min-height:540px}.tr-app .card{width:calc(100% - 12px);padding:10px}.tr-app .controls{gap:5px}.tr-app .controls button, .tr-app .controls select{padding:7px 8px;min-height:38px}}.tr-app /* フロート操作 */
.card{padding-bottom:32px}.tr-app .timeline{margin-top:15px}.tr-app .float-actions{position:fixed;z-index:35;right:16px;bottom:18px;display:flex;flex-direction:column;gap:8px}.tr-app .float-actions button{width:52px;height:52px;border:1px solid #cbd9ea;border-radius:50%;background:#fff;color:#1b477b;font-size:21px;font-weight:900;box-shadow:0 5px 15px #1b31604d}.tr-app .float-actions button.primary{background:#224f96;color:#fff}.tr-app .float-actions button:disabled{opacity:.45}.tr-app .float-panel{position:fixed;z-index:34;right:80px;bottom:18px;width:min(370px,calc(100vw - 98px));max-height:min(78vh,670px);overflow:auto;padding:14px;background:#fff;border:1px solid #d6e2ef;border-radius:18px;box-shadow:0 12px 35px #15284970}.tr-app .float-panel[hidden]{display:none}.tr-app .float-settings{display:grid;grid-template-columns:1fr 1fr;gap:8px}.tr-app .float-settings label{font-size:12px;font-weight:850;align-self:center}.tr-app .float-settings select, .tr-app .float-settings button{min-height:40px;border:1px solid #cbd9ea;border-radius:10px;background:#f4f8ff;color:#1c3d63;padding:7px;font-weight:800}.tr-app .float-settings button{grid-column:span 2}.tr-app .float-panel .import-box{margin-bottom:0}.tr-app .estimate{margin-top:4px;padding:3px 8px;border-radius:8px;background:#fff2d9;color:#895600;font-size:11px;font-weight:800;white-space:nowrap}.tr-app .estimate[hidden]{display:none}.tr-app .chart.is-smooth .row, .tr-app .chart.is-smooth .bar{transition:none}.tr-app .row{visibility:visible!important}.tr-app .note{padding-right:52px}@media(max-width:650px){.tr-app .float-actions{right:8px;bottom:10px;gap:6px}.tr-app .float-actions button{width:45px;height:45px;font-size:18px}.tr-app .float-panel{right:62px;bottom:10px;width:min(330px,calc(100vw - 74px))}.tr-app .estimate{font-size:9px}.tr-app .note{padding-right:45px}}.tr-app /* ランキング情報をヘッダー内へ */
.head{gap:clamp(14px,2.5vw,36px);align-items:center}.tr-app .head .brand{align-self:center}.tr-app .head .top{flex:1;min-width:0;align-items:center;gap:12px}.tr-app .head .head-info{min-width:0}.tr-app .head .eyebrow, .tr-app .head .source{color:#d8e4f3}.tr-app .head h1{color:#fff;margin:2px 0;font-size:clamp(20px,2.4vw,30px);line-height:1.18}.tr-app .head .year{color:#fff;font-size:clamp(28px,3.6vw,48px);text-align:right}.tr-app .head .head-year{min-width:145px;text-align:right}.tr-app .head .estimate{display:inline-block;background:#fff2d9;color:#754500}.tr-app .card{margin-top:12px}.tr-app .card .timeline{margin-top:0}
@media(max-width:760px){.tr-app .head{display:grid;grid-template-columns:1fr;gap:7px;padding:10px 12px}.tr-app .head .brand{font-size:18px}.tr-app .head .top{width:100%;align-items:center}.tr-app .head .eyebrow{font-size:10px}.tr-app .head h1{font-size:19px}.tr-app .head .source{font-size:10px;line-height:1.25}.tr-app .head .year{font-size:29px}.tr-app .head .head-year{min-width:118px}.tr-app .head .estimate{max-width:128px;white-space:normal;line-height:1.2;font-size:9px}}
@media(max-width:400px){.tr-app .head .head-year{min-width:105px}.tr-app .head h1{font-size:17px}.tr-app .head .year{font-size:27px}}.tr-app .settings-note{margin:12px 0 0;padding:10px;border-radius:10px;background:#f3f7fc;color:#50667d;font-size:12px;line-height:1.5}.tr-app /* 画面内に順位を収め、残りはページで見る */
html, .tr-app{height:100%;overflow:hidden}.tr-app .shell{height:100dvh;min-height:0;overflow:hidden}.tr-app .head{flex:none}.tr-app .card{min-height:0;overflow:hidden;display:flex;flex-direction:column;margin:8px auto;padding-bottom:8px}.tr-app .timeline, .tr-app .message, .tr-app .page-label{flex:none}.tr-app .page-label{font-size:12px;color:#52708b;font-weight:850;margin:0 0 5px}.tr-app .chart{flex:1;min-height:0!important;overflow:hidden}.tr-app .float-actions button:disabled{cursor:default}.tr-app .float-panel{max-height:78dvh}@media(max-width:650px){.tr-app .card{margin:6px auto;padding-bottom:5px}.tr-app .page-label{font-size:11px}}.tr-app .track{height:30px}@media(max-width:650px){.tr-app .track{height:28px}}.tr-app /* ヘッダーは教材名と年を左右に整理 */
.head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;min-height:96px;padding:12px clamp(14px,2vw,28px)}.tr-app .head-info{min-width:0}.tr-app .head .brand{font-size:12px;font-weight:800;letter-spacing:.06em;color:#a7c5ee}.tr-app .head h1{margin:3px 0 4px;font-size:clamp(22px,2.7vw,32px);line-height:1.12}.tr-app .head .source{font-size:11px;line-height:1.3;color:#d8e4f3}.tr-app .head-year{text-align:right;min-width:155px}.tr-app .year-caption{display:block;color:#a7c5ee;font-size:11px;font-weight:800}.tr-app .head .year{font-size:clamp(31px,4vw,48px);line-height:1.05}.tr-app .head .estimate{display:inline-block;margin-top:3px;white-space:normal;max-width:170px;text-align:center;font-size:10px;line-height:1.2}
@media(max-width:650px){.tr-app .head{grid-template-columns:minmax(0,1fr) auto;gap:7px;min-height:80px;padding:9px 10px}.tr-app .head .brand{font-size:10px}.tr-app .head h1{font-size:19px;margin:2px 0 3px}.tr-app .head .source{font-size:9px;line-height:1.2}.tr-app .head-year{min-width:105px}.tr-app .year-caption{font-size:9px}.tr-app .head .year{font-size:28px}.tr-app .head .estimate{max-width:110px;font-size:8px}}.tr-app /* ヘッダーをコンパクトにし、出典全文は設定へ */
.head{min-height:0;padding:6px 12px;gap:10px}.tr-app .head .brand{font-size:10px;line-height:1}.tr-app .head h1{font-size:clamp(19px,2.3vw,26px);line-height:1.08;margin:2px 0}.tr-app .head .source{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;line-height:1.2}.tr-app .head-year{min-width:105px}.tr-app .year-caption{font-size:9px;line-height:1}.tr-app .head .year{font-size:clamp(28px,3.3vw,38px);line-height:1.05}.tr-app .head .estimate{margin:1px 0 0;padding:2px 7px;white-space:nowrap;font-size:9px;line-height:1}.tr-app .settings-source{margin:8px 0 0;padding:10px;border-radius:10px;background:#f3f7fc;color:#50667d;font-size:11px;line-height:1.45;overflow-wrap:anywhere}
@media(max-width:650px){.tr-app .head{min-height:0;padding:5px 8px;gap:7px}.tr-app .head .brand{font-size:9px}.tr-app .head h1{font-size:18px}.tr-app .head .source{font-size:9px}.tr-app .head-year{min-width:88px}.tr-app .head .year{font-size:26px}.tr-app .year-caption{font-size:8px}.tr-app .head .estimate{font-size:8px}}.tr-app .float-actions #choose{background:#f5ce53;color:#17314b;border-color:#f5ce53;font-size:24px}.tr-app .chooser{position:fixed;inset:0;z-index:70;display:grid;place-items:center;padding:16px;background:#102440a8}.tr-app .chooser[hidden]{display:none}.tr-app .chooser-card{width:min(600px,100%);max-height:min(680px,90dvh);overflow:auto;background:white;border-radius:20px;padding:20px;box-shadow:0 20px 55px #081d3866}.tr-app .chooser-top{display:flex;justify-content:space-between;align-items:center;gap:12px}.tr-app .chooser-top h2{font-size:22px;margin:0}.tr-app .chooser-close{border:0;border-radius:50%;width:38px;height:38px;background:#edf2fb;color:#163452;font-size:23px}.tr-app .chooser-intro{color:#52677d;font-size:13px;margin:8px 0 16px}.tr-app .chooser-list{display:grid;gap:10px}.tr-app .chooser-group{margin:12px 0 0;color:#24456c;font-size:14px}.tr-app .chooser-item{width:100%;display:flex;justify-content:space-between;align-items:center;text-align:left;border:1px solid #d4e1f0;background:#f7faff;color:#183755;border-radius:12px;padding:13px 15px}.tr-app .chooser-item:hover, .tr-app .chooser-item:focus-visible{border-color:#497bd1;background:#ebf2ff}.tr-app .chooser-item[aria-current=true]{border-color:#2b62b1;background:#e7f0ff}.tr-app .chooser-item strong{display:block;font-size:17px}.tr-app .chooser-item small{display:block;font-size:12px;color:#5b7188;margin-top:3px}.tr-app .chooser-arrow{font-size:22px}.tr-app .chooser-hint{font-size:11px;color:#63768c;line-height:1.5;margin:16px 0 0}.tr-app .row[aria-hidden="false"]{cursor:pointer;border-radius:8px}.tr-app .row[aria-hidden="false"]:hover{background:#e8f2ff88}.tr-app .row:focus-visible{outline:3px solid #ffbc45;outline-offset:-3px;background:#e8f2ff}.tr-app .detail-overlay{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:14px;background:#102440a8}.tr-app .detail-overlay[hidden]{display:none}.tr-app .detail-card{width:min(650px,100%);max-height:calc(100dvh - 28px);overflow:auto;border-radius:20px;background:white;padding:clamp(16px,3vw,24px);box-shadow:0 20px 55px #081d3866}.tr-app .detail-top{display:flex;align-items:start;justify-content:space-between;gap:12px}.tr-app .detail-top h2{font-size:clamp(22px,4vw,30px);line-height:1.2;margin:0}.tr-app .detail-close{flex:none;width:40px;height:40px;border:0;border-radius:50%;background:#eaf1fa;color:#17314b;font-size:24px}.tr-app .detail-sub{color:#5b6f84;font-size:13px;font-weight:700;margin:4px 0 12px}.tr-app .detail-value{font-size:clamp(28px,6vw,42px);font-weight:900;font-variant-numeric:tabular-nums;color:#1e3c62;margin:2px 0 12px}.tr-app .detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.tr-app .detail-stat{background:#f2f6fc;border-radius:12px;padding:12px;min-width:0}.tr-app .detail-stat span{display:block;color:#5b6f84;font-size:11px;font-weight:800;margin-bottom:5px}.tr-app .detail-stat strong{display:block;color:#1e3c62;font-size:clamp(13px,2.6vw,17px);overflow-wrap:anywhere}.tr-app .detail-trend-title{font-size:14px;font-weight:850;color:#1e3c62;margin:16px 0 5px}.tr-app .detail-trend{height:112px;background:#f7faff;border-radius:12px;padding:8px}.tr-app .detail-trend-plot{position:relative;width:100%;height:100%}.tr-app .detail-trend svg{display:block;width:100%;height:100%}.tr-app .detail-trend-dot, .tr-app .detail-trend-marker{position:absolute;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none}.tr-app .detail-trend-dot{width:5px;height:5px;background:#3566b0}.tr-app .detail-trend-marker{width:12px;height:12px;background:#edba36;border:1.5px solid #233f68;box-shadow:0 0 0 2px #fff8}.tr-app .detail-years{display:flex;justify-content:space-between;color:#5b6f84;font-size:11px;font-weight:700;margin-top:3px}.tr-app .detail-source{font-size:11px;line-height:1.5;color:#5b6f84;margin:14px 0 0;overflow-wrap:anywhere}@media(max-width:520px){.tr-app .detail-grid{gap:6px}.tr-app .detail-stat{padding:9px}.tr-app .detail-stat strong{font-size:13px}}

/* WordPress content can appear below a theme header; the app occupies the viewport. */
.tr-app{position:fixed;inset:0;z-index:9990;overflow:hidden;background:linear-gradient(125deg,#8c8bdf,#5c91dd);font-family:system-ui,-apple-system,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;color:#17314b}
.tr-app .shell{height:100%;height:100dvh}
.tr-app .float-actions,.tr-app .float-panel,.tr-app .chooser,.tr-app .detail-overlay{position:absolute}
body.admin-bar .tr-app{top:32px;height:calc(100vh - 32px);height:calc(100dvh - 32px)}
body.admin-bar .tr-app .shell{height:100%}
@media(max-width:782px){body.admin-bar .tr-app{top:46px;height:calc(100vh - 46px);height:calc(100dvh - 46px)}}

/* Theme button padding and text line-height must not move the float glyphs. */
.tr-app .float-actions button{
  display:grid;
  place-items:center;
  padding:0;
  margin:0;
  line-height:1;
  text-align:center;
  appearance:none;
  flex:none;
}
