*{box-sizing:border-box}body{margin:0;background:#f7f6f0;color:#163c34;font:16px system-ui,"Microsoft YaHei",sans-serif}main{max-width:1800px;margin:auto;padding:32px}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}h1{font-size:42px;margin:4px 0}h2{font-size:24px}.eyebrow{color:#128b67;font-weight:700;letter-spacing:3px;font-size:13px}.panel{padding:26px;background:white;border:1px solid #dfe9e4;border-radius:24px;margin:20px 0}#login{max-width:500px;margin:50px auto}#login label{display:block;margin:16px 0}input,select,button{font:inherit;border:1px solid #dce8e3;border-radius:12px;padding:12px 16px;color:inherit;background:#fff}input:not([type=checkbox]){display:block;margin-top:8px;max-width:100%}button{cursor:pointer;background:#eaf2ee;font-weight:650}button.primary{background:#148b65;color:white;border-color:#148b65}button:disabled{opacity:.5;cursor:default}input[type=checkbox]{width:19px;height:19px;accent-color:#148b65;vertical-align:middle}.actions{display:flex;align-items:end;gap:12px;flex-wrap:wrap}nav{display:flex;gap:12px}.filters{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:20px;position:relative}details{border:1px solid #dce8e3;border-radius:16px;padding:18px;background:#fbfdfc}summary{cursor:pointer;display:flex;justify-content:space-between;font-weight:650}.options{position:absolute;left:0;right:0;z-index:5;background:white;box-shadow:0 14px 35px #183d3420;padding:16px;border:1px solid #dce8e3;border-radius:16px;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;margin-top:22px}.options label{display:flex;align-items:center;gap:8px;background:#edf4f0;border-radius:10px;padding:12px}.options label:nth-child(13){grid-row:3;grid-column:1}.options label:nth-child(14){grid-row:3;grid-column:2}.options label:nth-child(15){grid-row:3;grid-column:3}.options label:nth-child(16){grid-row:3;grid-column:4}.options label:nth-child(17){grid-row:3;grid-column:5}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;white-space:nowrap}th,td{text-align:left;padding:20px 12px;border-bottom:1px solid #edf1ee}th button{background:none;border:0;padding:0;color:#6c8580}td small{display:block;margin-top:6px;color:#758b84}.skill-badge{display:inline-block;background:#edf4f0;padding:5px 7px;border-radius:7px;margin:3px;font-size:13px}.skill-highlight,.nature-positive{color:#cf3732;font-weight:750}.skill-highlight{background:#fff0ed}.skill-rating-bonus{color:#2669b4;background:#edf4ff;font-weight:700}.shiny-name{color:#ce890c}.marker{color:#11875f;font-weight:700}.table-wrap td:first-child{min-width:100px}#summary,#sync-date{color:#758b84}#message{color:#b44a2e}#paging{justify-content:center;padding-top:20px}dialog{border:1px solid #dae7e1;border-radius:22px;padding:30px;max-width:460px}dialog::backdrop{background:#12392e55}[hidden]{display:none!important}@media(max-width:800px){main{padding:16px}.panel{padding:18px}.filters{grid-template-columns:1fr}.options{grid-template-columns:repeat(3,1fr)}.options label:nth-child(n){grid-row:auto;grid-column:auto}h1{font-size:34px}}
/* Research catalog layout */
body{background:#f5f7f3;color:#163d35;font-size:15px;line-height:1.5}main{max-width:1840px;padding:32px 40px}header{padding:4px 0 8px;margin-bottom:16px}h1{font-size:40px;letter-spacing:-1px}h2{font-size:19px;margin:0;font-weight:750}.eyebrow{font-size:11px;letter-spacing:2.5px;margin:0 0 8px}.panel{border-color:#dfe8e2;border-radius:22px;margin:16px 0;padding:24px;box-shadow:0 3px 14px #173f3103}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.section-heading>span,#summary{font-size:13px;color:#778d83;margin:0}.filters{gap:12px;margin-bottom:18px}details{padding:16px;background:#f8fbf9;border-radius:12px}summary{gap:12px;font-size:14px}summary span{color:#0c8b62;white-space:nowrap}summary span:after{content:'⌄';margin-left:12px}details[open]{border-color:#148b65}details[open] summary span:after{content:'⌃'}.options{margin-top:18px;border-radius:16px;padding:14px;box-shadow:0 12px 36px #173f311a}.options label{padding:10px;font-size:14px;cursor:pointer}.options label:has(input:checked){background:#ddf2e8;color:#086a49}.search-actions{display:grid;grid-template-columns:minmax(180px,1.4fr) repeat(3,minmax(120px,1fr)) auto auto;gap:14px;align-items:end}.search-actions label{display:flex;flex-direction:column;gap:7px;font-size:13px;color:#688276}.search-actions input,.search-actions select{width:100%;margin:0;font-size:14px;color:#163d35;height:46px}.search-actions button{height:46px;white-space:nowrap}input,select,button{border-radius:10px}button:hover:not(:disabled){filter:brightness(.97)}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #8fd7bd;outline-offset:3px}.results-panel{padding:24px 24px 8px}.table-wrap{border-radius:12px}table{font-size:14px}thead{background:#f5f8f5}th,td{padding:18px 12px}th{padding-top:13px;padding-bottom:13px}th button{font-size:13px;font-weight:650;white-space:nowrap}tbody tr:hover{background:#fafcf9}tbody tr.is-marked{background:#f0f8f3}.pokemon-col{font-size:17px;min-width:116px}.shiny-name,.shiny-mark{color:#d88b08}.shiny-mark{display:inline-block;margin-left:5px;font-size:18px}.skills-col{width:30%;min-width:300px}.subskills{display:flex;flex-wrap:wrap;gap:5px}.skill-badge{margin:0;padding:5px 7px;line-height:1.4}.date-col{font-variant-numeric:tabular-nums;color:#59766a}.nickname{color:#0b8b63}.rating{font-size:15px}.table-wrap td:first-child{min-width:116px}.table-wrap th:nth-last-child(2),.table-wrap td:nth-last-child(2){text-align:center}input[type=checkbox]{width:20px;height:20px;cursor:pointer;margin:0;flex-shrink:0}input:disabled{cursor:default}.empty{text-align:center;padding:64px 16px!important;white-space:normal}.empty strong{display:block;font-size:17px;font-weight:600;color:#59766a}.empty span{display:block;margin-top:8px;color:#8a9b92;font-size:13px}#paging{padding:20px 0;gap:12px}#message:empty{display:none}#sync-date{font-size:13px;margin-bottom:0}dialog{width:min(440px,calc(100vw - 32px));box-shadow:0 20px 80px #163d3533}dialog p{color:#688276}dialog .actions{justify-content:flex-end;margin-top:24px}
@media(max-width:1100px){main{padding:24px}.search-actions{grid-template-columns:repeat(4,minmax(0,1fr))}.nickname-field{grid-column:span 1}.search-actions button{grid-row:2}.skills-col{min-width:280px}.section-heading>span{display:none}}
@media(max-width:700px){main{padding:18px 12px}h1{font-size:32px}.panel{padding:18px 14px;border-radius:18px}header{padding:0 6px}.section-heading{margin-bottom:16px}.filters{grid-template-columns:1fr;gap:10px}.search-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.search-actions button{grid-row:auto}.options{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.options label{font-size:12px;padding:9px 6px;gap:5px}.options label:nth-child(n){grid-row:auto;grid-column:auto}.results-panel{padding-bottom:0}.table-wrap{border:1px solid #eef3ef}th,td{padding:15px 10px}#summary{font-size:12px}#sync-date{font-size:12px}.skill-badge{font-size:12px}}

/* Centered authorization landing page; catalog retains its own header layout. */
body.login-page{background:radial-gradient(ellipse at 50% 20%,#eaf4ed 0%,#f7f8f3 58%);min-height:100svh}.login-page main{min-height:100svh;max-width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:44px 20px}.login-page header{display:block;text-align:center;width:100%;margin:0 0 24px;padding:0}.login-page h1{font-size:38px;letter-spacing:1px;margin:8px 0}.login-page .eyebrow{font-size:11px;letter-spacing:3px}.login-page #sync-date{font-size:13px}.login-page #login{width:100%;max-width:440px;margin:0;padding:32px;border-radius:24px;box-shadow:0 16px 48px #264f3c0a}.login-emblem{display:grid;place-items:center;width:44px;height:44px;margin:0 auto 16px;border-radius:14px;background:#e7f4ed;color:#128b67;font-size:26px}#login h2{text-align:center;font-size:22px}#login .login-note{text-align:center;color:#7b8f84;font-size:13px;margin:8px 0 24px}#login label{font-size:14px;margin:18px 0 10px}#login input:not([type=checkbox]){width:100%;height:48px;margin-top:8px}#login .history-row{display:flex;align-items:center;gap:8px}#auth-history{min-width:0;flex:1;font-size:12px;padding:10px;background:#f8faf8;height:40px}#forget-code{font-size:12px;white-space:nowrap;padding:10px;background:transparent;height:40px}#login .actions{display:grid;grid-template-columns:auto 1fr;gap:12px;margin-top:22px}#login .actions button{height:48px}#login button[type=submit]{font-size:15px}.login-page #message{max-width:440px;text-align:center;font-size:13px;margin:14px 0 0}.login-page #message:empty{display:none}@media(max-width:600px){.login-page main{padding:28px 18px}.login-page #login{padding:26px 22px}.login-page h1{font-size:32px}.login-page header{margin-bottom:22px}}

.page-size-label{display:flex;align-items:center;gap:10px;color:#688276;font-size:13px}.page-size-label select{padding:8px 12px;background:#f8fbf9;font-size:13px;min-width:90px}

.filter-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 14px;position:relative;align-items:stretch}.filter-grid>.filters,.filter-grid>.search-actions{display:contents}.filter-grid>label,.filter-grid .search-actions>label{display:flex;flex-direction:column;justify-content:center;gap:7px;min-width:0;font-size:13px;color:#688276}.filter-grid select,.filter-grid input:not([type=checkbox]){height:46px;width:100%;margin:0;font-size:14px;color:#163d35}.filter-grid details{display:flex;flex-direction:column;justify-content:center;margin:0;min-width:0}.filter-grid summary{font-size:13px}.filter-grid .options{top:76px;margin:0}.filter-buttons{display:flex;justify-content:flex-end;gap:12px;margin-top:18px}.filter-buttons button{min-width:100px}.filter-grid .nickname-field{grid-column:auto}@media(max-width:700px){.filter-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.filter-grid details{padding:12px 10px}.filter-grid summary{font-size:12px;gap:5px}.filter-grid summary span:after{margin-left:4px}.filter-grid .options{top:auto;margin-top:180px}.filter-buttons button{flex:1}}

.filter-grid details{padding:0;border:0;background:transparent;border-radius:0}.filter-grid summary{display:flex;flex-direction:column;align-items:stretch;gap:7px;font-weight:400;color:#688276;line-height:19.5px}.filter-grid summary span{display:flex;align-items:center;justify-content:space-between;border:1px solid #dce8e3;border-radius:10px;height:46px;padding:12px 16px;font-size:14px;background:#fff;color:#163d35}.filter-grid details[open] summary span{border-color:#148b65}@media(max-width:700px){.filter-grid summary{font-size:12px}.filter-grid .options{top:166px;margin-top:0}}

@media(min-width:1001px){.filter-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}@media(min-width:701px) and (max-width:1000px){.filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Five fixed skill slots keep every account row aligned. */
.skills-col .subskills{display:grid;grid-template-columns:repeat(5,4.8em);width:max-content;gap:5px}
.skills-col .skill-badge{display:flex;align-items:center;justify-content:center;white-space:nowrap}
.nickname button{color:#0b8b63;padding:6px 10px;text-decoration:underline;text-underline-offset:3px}
.nickname button.lucky-account{color:#cf3732;font-weight:900}
#account-box{width:calc(100vw - 32px);max-width:1600px;max-height:90vh;padding:24px}
#account-box[open]{display:flex;flex-direction:column;overflow:hidden;max-height:90vh;max-height:90dvh}
#account-box header{flex:0 0 auto;gap:20px;margin-bottom:8px;padding:0}
#account-box .box-title-line{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 14px}
#account-box #box-count{color:#148b65;font-weight:700;white-space:nowrap}
#account-box #close-box{flex-shrink:0}
#account-box .table-wrap{min-height:0;max-height:none;overflow:auto;overscroll-behavior:contain}
#account-box thead{position:sticky;top:0;z-index:1}
#account-box th,#account-box td{text-align:left}
#account-box #box-status{flex:0 0 auto;white-space:normal;font-size:12px;margin:0 0 10px}
#account-box thead th{position:sticky;top:0;z-index:2;background:#f5f8f5;box-shadow:0 1px 0 #dfe8e2}
#account-box tr.detail-highlighted>td{background:#fffaf0;box-shadow:inset 0 2px #d6a23c,inset 0 -2px #d6a23c}
#account-box tr.detail-highlighted>td:first-child{box-shadow:inset 2px 0 #d6a23c,inset 0 2px #d6a23c,inset 0 -2px #d6a23c}
#account-box tr.detail-highlighted>td:last-child{box-shadow:inset -2px 0 #d6a23c,inset 0 2px #d6a23c,inset 0 -2px #d6a23c}
#account-box .box-high-label{color:#986a14;font-weight:700}

.account-export-actions{display:flex;gap:10px;flex-shrink:0}.dialog-head,#account-box>header{flex-wrap:wrap;gap:12px}

.skill-badge.skill-empty{visibility:hidden}

/* Compact pickers: preserve multi-select values and separate nature layout. */
.filter-grid .options{width:min(840px,100%);right:auto;max-height:320px;overflow-y:auto;padding:12px;gap:8px;grid-template-columns:repeat(7,minmax(0,1fr))}
.filter-grid .options label{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:8px;padding:9px 10px;font-size:14px;color:#163d35;min-height:38px}
.filter-grid .options input[type=checkbox]{width:17px;height:17px;padding:0;margin:0;flex:0 0 17px}
.filter-grid #nature{position:relative}
.filter-grid #nature .options{top:calc(100% + 8px);left:0;right:auto;width:max(100%,290px);max-width:calc(100vw - 56px);display:flex;flex-direction:column;gap:2px;max-height:300px;margin:0;padding:10px;z-index:8}
.filter-grid #nature .options label{background:transparent;white-space:nowrap;min-height:38px;padding:8px 10px;grid-row:auto;grid-column:auto}
.filter-grid #nature .options label:hover,.filter-grid #nature .options label:has(input:checked){background:#edf5f0}
@media(max-width:700px){.filter-grid .options{grid-template-columns:repeat(3,minmax(0,1fr));max-height:300px}.filter-grid #nature .options{width:290px;left:auto;right:0}.filter-grid .options label{font-size:13px;padding:8px}}

.nickname{white-space:nowrap}.nickname .copy-account-id{display:inline-block;vertical-align:middle;margin:0 0 0 8px;padding:6px 10px;font-size:12px;white-space:nowrap;color:#177858;background:#eff7f3}.nickname .copy-account-id:disabled{opacity:.75}.clipboard-fallback{position:fixed;left:-10000px;top:0}

/* Mobile research list: keep identity, nature and all five original skill slots in view. */
@media(max-width:600px){
 body:not(.login-page) main{padding:16px 8px}
 #app .results-panel{padding:12px 8px;border-radius:16px}
 #app .results-panel .table-wrap>table{table-layout:fixed;width:1050px;min-width:1050px;font-size:13px}
 #app .results-panel .table-wrap :is(th,td){padding:10px 4px;vertical-align:middle}
 #app .results-panel .table-wrap :is(th,td):nth-child(1){width:72px;min-width:0;white-space:normal;overflow-wrap:anywhere;font-size:13px}
 #app .results-panel .table-wrap :is(th,td):nth-child(2){width:48px;min-width:0;white-space:normal;overflow-wrap:anywhere}
 #app .results-panel .table-wrap :is(th,td):nth-child(3){width:190px;min-width:0}
 #app .skills-col .subskills,#account-box .skills-col .subskills{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;min-width:0;gap:4px;line-height:1.4}
 #app .skills-col .skill-badge,#account-box .skills-col .skill-badge{min-width:0;margin:0;padding:4px 2px;font-size:11px;line-height:1.4;white-space:normal;overflow-wrap:anywhere;text-align:center}
 #account-box .skills-col{min-width:170px;width:170px}
}
@media(max-width:380px){
 #app .results-panel .table-wrap :is(th,td):nth-child(1){width:60px}
 #app .results-panel .table-wrap :is(th,td):nth-child(2){width:44px}
 #app .results-panel .table-wrap :is(th,td):nth-child(3){width:164px}
}

.auth-code-picker{position:relative;display:block;min-width:0;width:100%}
.auth-code-suggestions[hidden]{display:none!important}
.auth-code-suggestions{position:absolute;z-index:20;left:0;right:0;top:100%;margin-top:6px;max-height:240px;overflow:auto;background:#fff;border:1px solid #d7e5de;border-radius:14px;box-shadow:0 10px 28px #12392b20;padding:6px}
.auth-code-history-row{display:flex;align-items:center;gap:4px;min-width:0}
#login .auth-code-history-row button{margin:0;border:0;box-shadow:none;background:transparent;color:#163d31;border-radius:8px;height:auto;min-height:44px;font-size:14px;padding:10px;text-align:left}
#login .auth-code-history-row .auth-code-choice{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#login .auth-code-history-row .auth-code-remove{flex:none;font-size:12px;color:#72867b}
#login .auth-code-history-row button:hover,#login .auth-code-history-row button:focus-visible{background:#eaf4ef;outline:2px solid #8ccdb2;outline-offset:-2px}
#auth-history-tools[hidden],#login .history-row[hidden]{display:none!important}
