:root{--ink:#142942;--text:#263b54;--muted:#6d7d8f;--soft:#f4f7fa;--line:#e6ebf0;--blue:#25486f;--blue2:#dfeaf6;--gold:#ad8545;--shadow:0 6px 24px rgba(14,35,65,.045);font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;color:var(--ink);background:#f6f8fb;font-synthesis:none;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100dvh}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.35;cursor:default}a{color:var(--blue)}.shell{max-width:880px;margin:0 auto;min-height:100dvh;background:white;box-shadow:0 0 36px rgba(18,38,68,.07);position:relative;padding-bottom:calc(96px + env(safe-area-inset-bottom))}.topbar{height:80px;display:flex;align-items:center;justify-content:space-between;padding:12px 24px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.97);position:sticky;top:0;z-index:15;backdrop-filter:blur(12px)}.brand{display:flex;align-items:center;gap:12px}.brand-mark{width:40px;height:40px;display:grid;place-items:center;background:#edf3f9;color:#294c74;border-radius:13px}.brand-mark svg{width:23px;height:23px}.brand-copy{display:flex;flex-direction:column;line-height:1.4}.brand-copy b{font-size:18px;letter-spacing:-.035em}.eyebrow{font-size:10px;color:#7a8aa0;font-weight:650;letter-spacing:.14em}.brand-dot{color:#d1a765}.icon-button{display:grid;place-items:center;border:none;background:var(--soft);color:var(--blue);width:38px;height:38px;border-radius:12px}.icon-button svg{width:19px;height:19px;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}main{padding:25px 24px 35px;max-width:100%;min-height:70vh}.page-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:23px}.page-title{font-size:27px;line-height:1.35;letter-spacing:-.04em;margin:4px 0 0}.overline{font-size:12px;font-weight:700;color:#7b8a9d;letter-spacing:.055em}.mini-action{border:1px solid var(--line);color:#49647e;background:white;border-radius:11px;padding:9px 11px;font-size:12px;font-weight:700}.hero{border-radius:20px;padding:22px 22px 19px;background:linear-gradient(125deg,#f3f7fc,#f7f9fb 68%,#f6f3ed);border:1px solid #edf1f5;margin-bottom:27px}.hero-top{display:flex;justify-content:space-between;align-items:flex-end;gap:12px}.hero-label{font-size:12px;color:#697d93;font-weight:700}.count-number{font-weight:750;font-size:49px;letter-spacing:-.075em;line-height:1.25;font-variant-numeric:tabular-nums;white-space:nowrap}.count-number small{font-size:16px;font-weight:650;letter-spacing:0;margin-left:4px}.featured-count{display:flex;align-items:center;gap:5px;color:var(--ink);font-size:15px;font-weight:700;white-space:nowrap}.featured-count svg{color:#b18e54;width:16px;height:16px;fill:currentColor}.small-muted{font-size:11px;color:#7c8d9e}.hero-foot{margin:12px 0 0;color:#778ba0;font-size:11px}.stacked-bar{height:6px;display:flex;gap:3px;margin-top:16px}.stacked-bar span{min-width:3px;min-height:6px;border-radius:10px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:23px 0 13px}.section-title{font-size:18px;letter-spacing:-.03em;margin:0}.section-sub{font-size:11px;color:#8998a9}.pin{background:#f1f5f9;color:#546e88;border:1px solid #e9eef4;border-radius:999px;font-weight:700;padding:5px 9px;font-size:11px}.picks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin-bottom:17px}.pick-card{text-align:left;border:1px solid var(--line);background:white;border-radius:15px;padding:14px;display:flex;flex-direction:column;gap:7px;box-shadow:var(--shadow);min-height:150px}.pick-card:hover,.article-card:hover{border-color:#b0c5dc}.pick-no{font-size:11px;color:var(--gold);font-weight:750}.pick-title{font-size:14px;font-weight:750;line-height:1.6;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.pick-meta{font-size:11px;color:var(--muted);margin-top:auto}.category-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:27px 0 12px}.category-name{display:flex;gap:9px;align-items:center;min-width:0}.category-symbol{width:29px;height:29px;border-radius:10px;background:#edf2f7;display:grid;place-items:center;color:#31587f;flex-shrink:0;font-size:15px}.category-name h3{font-size:16px;letter-spacing:-.02em;margin:0}.category-count{font-size:12px;color:var(--muted);font-weight:650;white-space:nowrap}.scroll-strip{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:3px 2px 14px;margin:0 -2px;scrollbar-width:thin;scrollbar-color:#cdd8e5 transparent}.article-card{flex:0 0 min(83%,350px);scroll-snap-align:start;min-height:207px;border:1px solid var(--line);border-radius:18px;padding:16px 17px;display:flex;flex-direction:column;gap:10px;text-align:left;background:white;box-shadow:var(--shadow);color:inherit}.article-kicker{font-size:11px;color:#7a8a9a;font-weight:700;display:flex;justify-content:space-between;gap:8px}.top-indicator{color:var(--gold)}.article-title{font-size:17px;letter-spacing:-.035em;font-weight:750;line-height:1.56;margin:0}.article-summary{font-size:12px;line-height:1.75;color:#5e7185;margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.article-card-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:auto;font-size:11px;color:#6c8197;font-weight:700}.arrow{font-size:19px;color:#7390ae}.legend{font-size:11px;color:#8a9bac;margin:-6px 0 12px}.extras-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.extra-tile{border-radius:15px;padding:16px;background:#f5f7fa;border:1px solid #eff2f6;display:flex;flex-direction:column;gap:10px;text-align:left;min-height:106px;color:#1c3552}.extra-tile strong{font-size:14px}.extra-tile span{font-size:11px;color:#798b9f}.extra-tile .tile-icon{font-size:20px}.subtle-line{height:1px;background:var(--line);margin:22px 0}.tabbar{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(880px,100%);display:flex;align-items:stretch;border-top:1px solid #e7edf3;background:rgba(255,255,255,.97);backdrop-filter:blur(18px);padding:7px 10px calc(7px + env(safe-area-inset-bottom));z-index:15}.tab{flex:1;background:none;border:0;color:#8d9bae;display:flex;flex-direction:column;align-items:center;gap:4px;padding:7px 4px;font-size:10px;font-weight:650}.tab svg{width:21px;height:21px;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.tab.active{color:#24476c}.tab.active span{font-weight:800}.back-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:18px}.back{border:0;background:transparent;color:#466580;font-size:13px;font-weight:750;padding:8px 0}.save-button{border:1px solid var(--line);background:#fff;border-radius:10px;padding:9px 12px;color:#365573;font-size:12px;font-weight:700}.article-full-title{font-size:25px;line-height:1.55;letter-spacing:-.045em;margin:10px 0 13px}.article-full-lede{color:#465e77;font-size:15px;line-height:1.9;background:#f3f7fb;padding:17px;border-radius:14px}.meta-line{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 16px;align-items:center}.meta-tag{font-size:11px;background:#edf3f9;border-radius:6px;padding:5px 8px;color:#506c88;font-weight:700}.detail-section{margin:23px 0}.detail-section h3{font-size:14px;color:#315374;margin:0 0 8px;display:flex;align-items:center;gap:8px}.detail-section h3:before{content:"";height:15px;width:3px;border-radius:6px;background:#9bb5cf}.detail-section p{font-size:14px;line-height:1.95;color:#32475e;margin:0;white-space:pre-wrap;overflow-wrap:anywhere}.source-link{display:inline-flex;gap:6px;align-items:center;color:#295881;text-decoration:none;border-bottom:1px solid #97b0c6;padding-bottom:3px;font-size:13px}.notice{border:1px solid #e9edf1;border-radius:12px;background:#f8fafc;color:#657b91;line-height:1.7;font-size:12px;padding:13px 15px;margin:18px 0}.empty{border:1px dashed #d7e0e9;background:#f8fafc;border-radius:16px;text-align:center;padding:36px 20px;color:#657b91;font-size:13px;line-height:1.75}.empty .empty-icon{font-size:34px;display:block;margin-bottom:8px}.row-article{display:flex;gap:12px;align-items:center;justify-content:space-between;text-align:left;width:100%;background:white;border:0;border-bottom:1px solid var(--line);padding:16px 0;color:inherit}.row-title{font-size:14px;line-height:1.65;font-weight:700}.row-meta{font-size:11px;color:#8998aa;margin-top:5px}.searchbox{display:flex;align-items:center;gap:9px;border:1px solid #dae3ed;background:#f8fafc;padding:12px 14px;border-radius:13px}.searchbox input{min-width:0;flex:1;outline:0;border:0;background:transparent;color:var(--ink);font-size:15px}.filter-row{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:14px 0 4px}.chip{border:1px solid #e0e7ee;border-radius:100px;background:white;white-space:nowrap;padding:8px 12px;color:#637b92;font-size:12px;font-weight:700}.chip.selected{background:#25486f;color:white;border-color:#25486f}.fieldlabel{display:block;color:#334f6a;font-weight:750;font-size:13px;margin:19px 0 7px}.field{width:100%;padding:12px 13px;border-radius:11px;border:1px solid #dbe3ed;outline-color:#8caccc;background:white;color:#263d55;font-size:14px}.field:focus{border-color:#8aa9cb}.button{border:0;background:#264b74;color:white;border-radius:12px;padding:12px 17px;font-size:13px;font-weight:750}.button.secondary{background:#eff3f8;color:#315577}.button.outline{border:1px solid #d6e1eb;background:white;color:#315577}.button-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:13px}.settings-card{padding:17px;border:1px solid #e4eaf0;border-radius:15px;margin:14px 0}.settings-card h3{font-size:15px;margin:0 0 6px}.settings-card p{font-size:12px;line-height:1.8;color:#6c7e90;margin:6px 0}.import-zone{border:1px dashed #b7c8d9;padding:18px;border-radius:14px;background:#f8fafc;margin-top:12px}.ratings-card{padding:15px 0;border-bottom:1px solid var(--line)}.ratings-card h3{font-size:15px;line-height:1.6;margin:0 0 8px}.ratings-card p{font-size:13px;line-height:1.9;color:#50647b;margin:0 0 11px;white-space:pre-wrap}.ratingline{display:flex;align-items:center;gap:12px}.ratingline input{flex:1;accent-color:#2f5e8b}.score{font-weight:750;color:#315779;min-width:45px;text-align:right}.extra-section{margin-top:27px}.extra-section h2{font-size:17px}.small-btn{background:#edf3f8;border:0;color:#375b7a;border-radius:9px;padding:8px 10px;font-size:11px;font-weight:700}.history-card{display:flex;align-items:center;justify-content:space-between;width:100%;background:white;border:1px solid var(--line);border-radius:14px;margin:12px 0;padding:17px;text-align:left;color:inherit}.history-date{font-size:15px;font-weight:750}.history-meta{font-size:12px;color:#71869b;margin-top:7px}#toast{position:fixed;bottom:calc(83px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%) translateY(24px);opacity:0;pointer-events:none;background:#233e5c;color:white;padding:11px 18px;border-radius:999px;z-index:40;transition:.2s;font-size:12px;box-shadow:0 8px 25px rgba(10,30,60,.15);white-space:nowrap;max-width:94vw;overflow:hidden;text-overflow:ellipsis}#toast.visible{transform:translateX(-50%) translateY(0);opacity:1}.inline-count{white-space:nowrap;font-variant-numeric:tabular-nums}.quiet{color:#8294a6;font-size:12px}.status-demo{font-size:10px;font-weight:750;border:1px solid #eadfc8;background:#faf6ec;color:#967b4d;padding:5px 8px;border-radius:7px}.sticky-controls{display:flex;gap:8px;align-items:center}.mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px;word-break:break-all}code{background:#f0f4f8;padding:2px 4px;border-radius:4px}.date-input{margin-left:auto}input[type=file]{max-width:100%;font-size:13px}.section-banner{color:#385a7d;font-size:13px;font-weight:700;margin-top:4px}.text-action{border:0;background:transparent;color:#365b80;font-size:12px;font-weight:750;padding:5px}.list-toggle{display:flex;gap:8px;align-items:center;justify-content:space-between}.intro{font-size:13px;line-height:1.85;color:#6a7f93}
@media(max-width:520px){.topbar{padding:10px 18px;height:72px}main{padding:23px 18px 28px}.page-title{font-size:25px}.hero{padding:20px}.picks{gap:8px}.pick-card{padding:12px;min-height:153px}.pick-title{font-size:13px}.article-card{flex-basis:89%}.category-name h3{font-size:15px}.article-full-title{font-size:22px}.count-number{font-size:45px}}
@media(min-width:768px){.article-card{flex-basis:44%}.picks{grid-template-columns:repeat(3,minmax(0,1fr))}.extras-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}#toast{transition:none}}