:root{--bg: #ffffff;--bg-soft: #fafafa;--bg-strong: #f4f4f4;--border: #ececec;--border-strong: #d4d4d4;--ink: #0a0a0a;--ink-soft: #525252;--ink-muted: #a3a3a3;--accent: #0a0a0a;--red: #dc2626;--r-sm: 4px;--r-md: 6px;--r-lg: 8px;--r-xl: 12px;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 20px;--sp-6: 24px;--sp-8: 32px;--sp-10: 40px;--font: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:var(--font);background:var(--bg);color:var(--ink);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;letter-spacing:-.01em}button,input,select{font-family:inherit}.app-shell{max-width:480px;margin:0 auto;min-height:100%;background:var(--bg);display:flex;flex-direction:column;position:relative;border-left:1px solid var(--border);border-right:1px solid var(--border)}.app-header{position:sticky;top:0;z-index:20;background:var(--bg);border-bottom:1px solid var(--border);padding:14px var(--sp-4);display:flex;align-items:baseline;gap:10px}.app-header h1{font-size:17px;font-weight:600;margin:0;letter-spacing:-.02em;color:var(--ink)}.app-header .sub{font-size:11px;color:var(--ink-muted);letter-spacing:.02em}.app-header .link-btn{margin-left:auto;font-size:12px;letter-spacing:0;text-decoration:none;color:var(--ink-soft);padding:4px 8px;border-radius:var(--r-sm)}.app-header .link-btn:hover{background:var(--bg-soft);color:var(--ink)}.app-content{flex:1;padding:var(--sp-5) var(--sp-4);padding-bottom:96px;overflow-y:auto}.page-title{font-size:24px;font-weight:600;margin:0 0 4px;letter-spacing:-.02em;color:var(--ink)}.page-sub{font-size:13px;color:var(--ink-muted);margin:0 0 var(--sp-6)}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:480px;background:var(--bg);border-top:1px solid var(--border);display:flex;z-index:30;padding-bottom:env(safe-area-inset-bottom,0)}.bottom-nav a{flex:1;text-align:center;padding:12px 4px 10px;text-decoration:none;color:var(--ink-muted);font-size:11px;display:flex;flex-direction:column;align-items:center;gap:4px;transition:color .12s ease}.bottom-nav a .ic{font-size:18px;line-height:1;font-weight:300}.bottom-nav a.active,.bottom-nav a.active .ic{color:var(--ink)}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;cursor:pointer;background:var(--ink);color:#fff;font-size:14px;font-weight:500;border-radius:var(--r-md);padding:12px 18px;width:100%;height:44px;transition:opacity .15s ease;letter-spacing:-.01em}.btn:active{opacity:.7}.btn:disabled{background:var(--bg-strong);color:var(--ink-muted);cursor:not-allowed}.btn.secondary{background:var(--bg);color:var(--ink);border:1px solid var(--border-strong)}.btn.secondary:active{background:var(--bg-soft);opacity:1}.btn.ghost{background:transparent;color:var(--ink);width:auto;padding:8px 12px}.btn.small{width:auto;flex:1;padding:9px 14px;font-size:13px;height:36px}.btn.danger{background:var(--ink)}.btn.danger:active{opacity:.7}.page-head{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);margin-bottom:var(--sp-3)}.page-head .page-title{margin-bottom:0}.section-title{font-size:14px;font-weight:600;color:var(--ink);margin:var(--sp-6) 0 var(--sp-3)}.trend-sub{font-size:11px;line-height:1.6;color:var(--ink-muted);margin-bottom:var(--sp-2)}.trend-scroll{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;margin:0 calc(var(--sp-1) * -1);padding:0 var(--sp-1)}.trend-svg{width:100%;height:auto;display:block}.trend-base{stroke:var(--border);stroke-width:1}.trend-mean{stroke:var(--border-strong);stroke-width:1;stroke-dasharray:3 3}.trend-line{stroke:var(--ink);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}.trend-dot{fill:var(--ink)}.trend-ylabel{fill:var(--ink-muted);font-size:9px;text-anchor:end}.trend-xlabel{fill:var(--ink-muted);font-size:9px;text-anchor:middle}.trend-xtick line{stroke:var(--border-strong);stroke-width:1}.trend-xtick text{fill:var(--ink-muted);font-size:9px;text-anchor:middle}.filter-panel{background:var(--bg);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--sp-4);margin-bottom:var(--sp-4)}.filter-group{margin-bottom:var(--sp-4)}.filter-group:last-of-type{margin-bottom:var(--sp-3)}.filter-hint{font-size:12px;color:var(--ink-muted);line-height:1.5;background:var(--bg-soft);border-radius:var(--r-md);padding:var(--sp-2) var(--sp-3);margin-bottom:var(--sp-4)}.filter-label{font-size:12px;font-weight:600;color:var(--ink-muted);margin-bottom:var(--sp-2);letter-spacing:.02em}.chip-row{display:flex;flex-wrap:wrap;gap:var(--sp-2)}.chip{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--border-strong);background:var(--bg);color:var(--ink);font-size:13px;font-weight:500;border-radius:999px;padding:7px 14px;cursor:pointer;transition:border-color .12s ease,background .12s ease,color .12s ease}.chip:hover{border-color:var(--ink-muted)}.chip.active{background:var(--ink);color:#fff;border-color:var(--ink)}.date-row{display:flex;align-items:center;gap:var(--sp-2)}.date-row input[type=date]{flex:1;height:40px;border:1px solid var(--border-strong);border-radius:var(--r-md);background:var(--bg);color:var(--ink);font-size:14px;padding:0 12px}.date-sep{color:var(--ink-muted);font-size:13px}.filter-actions{display:flex;gap:var(--sp-2);margin-top:var(--sp-2)}.filter-actions .btn{width:auto;flex:1}.filter-summary{font-size:12px;color:var(--ink-muted);margin-bottom:var(--sp-3);display:flex;align-items:center;gap:10px}.filter-summary .link-btn{background:none;border:none;color:var(--ink);font-size:12px;cursor:pointer;padding:0;text-decoration:underline}.card{background:var(--bg);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--sp-4);margin-bottom:var(--sp-3)}.card-title{font-size:13px;font-weight:600;color:var(--ink-soft);margin:0 0 var(--sp-3);letter-spacing:0}.section-label{font-size:12px;font-weight:600;color:var(--ink-soft);margin:var(--sp-6) 0 var(--sp-2);letter-spacing:.02em}.section-label:first-of-type{margin-top:var(--sp-4)}.field{margin-bottom:var(--sp-3)}.field label{display:block;font-size:12px;font-weight:500;color:var(--ink-soft);margin-bottom:6px;letter-spacing:0}.field-hint{font-size:11px;color:var(--ink-muted);margin:6px 0 0;letter-spacing:0;line-height:1.4}.input,.select{width:100%;height:44px;background:var(--bg);color:var(--ink);border:1px solid var(--border-strong);border-radius:var(--r-md);padding:0 var(--sp-3);font-size:15px;transition:border-color .12s ease;-webkit-appearance:none;-moz-appearance:none;appearance:none}.input::placeholder{color:var(--ink-muted)}.input:focus,.select:focus{outline:none;border-color:var(--ink)}.row-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3)}.badge{display:inline-flex;align-items:center;background:var(--bg-strong);color:var(--ink);border-radius:var(--r-sm);padding:3px 8px;font-size:11px;font-weight:500;letter-spacing:0}.badge.muted{background:var(--bg-soft);color:var(--ink-soft);border:1px solid var(--border)}.segmented{display:flex;gap:6px;background:var(--bg-soft);border:1px solid var(--border);border-radius:var(--r-md);padding:3px}.segmented button{flex:1;background:transparent;border:none;border-radius:var(--r-sm);padding:8px 6px;font-size:13px;font-weight:500;color:var(--ink-soft);cursor:pointer;transition:background .12s ease,color .12s ease}.segmented button.active{background:var(--bg);color:var(--ink)}.card-face{width:46px;height:62px;border-radius:var(--r-sm);background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:600;line-height:1;-webkit-user-select:none;user-select:none}.card-face .rank{font-size:17px}.card-face .suit{font-size:16px;margin-top:2px}.card-face.red{color:var(--red)}.card-face.black{color:var(--ink)}.slot-grid{display:flex;gap:var(--sp-2);flex-wrap:wrap}.slot{width:56px;height:76px;border-radius:var(--r-md);background:var(--bg-soft);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;color:var(--ink-muted);font-size:11px;gap:4px}.slot.filled{background:var(--bg-soft)}.slot .ph{font-size:20px;font-weight:300;color:var(--ink-muted)}.sheet-mask{position:fixed;top:0;right:0;bottom:0;left:0;background:#0a0a0a66;display:flex;align-items:flex-end;justify-content:center;z-index:50;animation:fadeIn .18s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.sheet{width:100%;max-width:480px;background:var(--bg);border-radius:var(--r-xl) var(--r-xl) 0 0;padding:var(--sp-5) var(--sp-4) calc(var(--sp-5) + env(safe-area-inset-bottom,0));animation:slideUp .22s cubic-bezier(.2,.8,.2,1)}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.sheet h3{margin:0 0 var(--sp-4);font-size:16px;font-weight:600;color:var(--ink)}.suit-row{display:flex;gap:var(--sp-2);margin-bottom:var(--sp-4)}.suit-row button{flex:1;height:48px;border-radius:var(--r-md);border:1px solid var(--border-strong);background:var(--bg);font-size:22px;cursor:pointer;transition:border-color .12s ease}.suit-row button.red{color:var(--red)}.suit-row button.black{color:var(--ink)}.suit-row button.active{border-width:1.5px;border-color:var(--ink)}.suit-row button.active.red{border-color:var(--red)}.suit-row button.active.black{border-color:var(--ink)}.rank-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--sp-2)}.rank-grid button{height:46px;border-radius:var(--r-md);border:1px solid var(--border-strong);background:var(--bg);font-size:15px;font-weight:600;cursor:pointer;transition:color .12s ease,opacity .12s ease,border-color .12s ease}.rank-grid button:hover:not(:disabled){border-color:var(--ink-muted)}.rank-grid button:disabled{color:var(--ink-muted);cursor:not-allowed}.rank-grid button:disabled:not(.active){background:var(--bg-soft);opacity:.45;color:var(--ink-muted);text-decoration:line-through}.rank-grid button.red{color:var(--red)}.rank-grid button.black{color:var(--ink)}.score-box{background:var(--bg-soft);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--sp-4);margin-top:var(--sp-3);display:flex;align-items:center;gap:var(--sp-4)}.score-box .num-wrap{display:flex;flex-direction:column;gap:2px;flex-shrink:0}.score-box .num-wrap .lbl{font-size:11px;color:var(--ink-muted);letter-spacing:.04em;font-weight:500}.score-box .big{font-size:36px;font-weight:700;color:var(--ink);line-height:1;letter-spacing:-.03em}.score-box .meta{display:flex;flex-wrap:wrap;gap:6px}.luck-bar{background:var(--bg-soft);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--sp-3) var(--sp-4);margin-top:var(--sp-3);font-size:12px;color:var(--ink-soft);display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center;line-height:1.7}.luck-bar b{color:var(--ink);font-weight:600}.stat-hero{background:var(--bg);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--sp-6) var(--sp-4);text-align:left;margin-bottom:var(--sp-3)}.stat-hero .num{font-size:36px;font-weight:700;line-height:1;color:var(--ink);letter-spacing:-.03em}.stat-hero .lbl{font-size:12px;color:var(--ink-muted);margin-top:6px;letter-spacing:0}.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-2);margin-bottom:var(--sp-3)}.metric{background:var(--bg);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--sp-3) var(--sp-4)}.metric .num{font-size:22px;font-weight:700;color:var(--ink);line-height:1.2;letter-spacing:-.02em}.metric .lbl{font-size:11px;color:var(--ink-soft);margin-top:4px}.metric .sub{font-size:10px;color:var(--ink-muted);margin-top:2px}.bar-row{display:flex;align-items:center;gap:var(--sp-3);padding:8px 0}.bar-row .name{width:64px;font-size:13px;color:var(--ink-soft);flex-shrink:0}.bar-row .track{flex:1;height:4px;background:var(--bg-strong);border-radius:9999px;overflow:hidden;position:relative}.bar-row .fill{height:100%;background:var(--ink);border-radius:9999px}.bar-row .val{width:84px;text-align:right;font-size:11px;color:var(--ink-muted);flex-shrink:0}.hand-row-wrap{border:1px solid var(--border);border-radius:var(--r-lg);margin-bottom:var(--sp-2);background:var(--bg);overflow:hidden;transition:border-color .12s ease}.hand-row-wrap.open{border-color:var(--ink)}.hand-row-wrap .hand-row{margin-bottom:0;border:none;cursor:pointer;padding:var(--sp-3) var(--sp-4)}.hand-row{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3)}.hand-row .info{flex:1;min-width:0}.hand-row .info .t{font-size:13px;color:var(--ink);font-weight:500}.hand-row .info .m{font-size:11px;color:var(--ink-muted);margin-top:3px}.tag-win{color:var(--ink);font-weight:600}.tag-lose{color:var(--ink-soft);font-weight:600}.tag-fold{color:var(--ink-muted);font-weight:500}.hand-detail{border-top:1px solid var(--border);padding:var(--sp-3) var(--sp-4) var(--sp-4);background:var(--bg-soft)}.detail-line{display:flex;gap:var(--sp-3);padding:5px 0;font-size:12px;color:var(--ink);align-items:center}.detail-line .k{width:64px;flex-shrink:0;color:var(--ink-muted);font-size:11px}.detail-line .mini-cards{display:inline-flex;gap:4px}.detail-line .mini-cards .card-face{width:30px;height:42px}.detail-line .mini-cards .card-face .rank{font-size:13px}.detail-line .mini-cards .card-face .suit{font-size:12px}.detail-actions{display:flex;gap:var(--sp-2);margin-top:var(--sp-3)}.notice{font-size:12px;color:var(--ink-muted);margin-top:var(--sp-2);line-height:1.5}.error-text{color:var(--ink);font-size:12px;margin-top:var(--sp-2);padding:var(--sp-3);background:var(--bg-soft);border:1px solid var(--border);border-left:3px solid var(--danger, #c0392b);border-radius:var(--r-md);display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-2)}.link-btn{background:none;border:none;padding:0;margin-left:auto;color:var(--ink);font-size:12px;font-weight:600;text-decoration:underline;cursor:pointer}.pillar-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-2)}.pillar{border:1px solid var(--border);border-radius:var(--r-md);padding:var(--sp-3) 0;text-align:center;background:var(--bg)}.pillar .gz{font-size:20px;font-weight:600;color:var(--ink);letter-spacing:-.02em}.pillar .cap{font-size:11px;color:var(--ink-muted);margin-top:4px;letter-spacing:0}.dayun-item{display:flex;align-items:center;gap:var(--sp-3);padding:10px 0;border-bottom:1px solid var(--border)}.dayun-item:last-child{border-bottom:none}.dayun-item .gz{font-size:15px;font-weight:600;width:56px;color:var(--ink)}.dayun-item .meta{font-size:11px;color:var(--ink-muted)}.empty{text-align:center;color:var(--ink-muted);padding:var(--sp-10) var(--sp-4);font-size:13px;line-height:1.6}