@import"https://www.iconoptical.com/library/css/hub-shared.css";:root,body{--k-font-base: "PingFang HK", "Noto Sans HK", "Microsoft JhengHei", -apple-system, sans-serif;--k-text-xs: 16px;--k-text-sm: 18px;--k-text-base: 20px;--k-text-lg: 24px;--k-text-xl: 28px;--k-text-2xl: 34px;--k-text-3xl: 42px;--k-border: 3px solid #e2e8f0;--k-border-dark: 3px solid #1e293b;--k-border-focus: 4px solid #3b82f6;--k-radius: 16px;--k-radius-lg: 24px;--k-radius-sm: 10px;--k-btn-height: 72px;--k-btn-height-lg:88px;--k-input-height: 64px;--k-icon-size: 32px;--k-bg: var(--hub-bg, #0f1923);--k-surface: var(--hub-surface-solid, #1a2a3a);--k-text: var(--hub-text, #f8fafc);--k-text-muted: var(--hub-text-muted, #94a3b8);--k-accent: var(--hub-accent, #3b82f6);--k-success: var(--hub-success, #4ade80);--k-warning: var(--hub-warning, #fbbf24);--k-danger: var(--hub-danger, #f87171);--k-gap: 20px;--k-pad: 24px;--k-pad-lg: 36px}*,*:before,*:after{box-sizing:border-box}body{font-family:var(--k-font-base);font-size:var(--k-text-base);background:var(--k-bg);color:var(--k-text);margin:0;padding:0;-webkit-font-smoothing:antialiased;min-height:100vh;user-select:none;-webkit-user-select:none;touch-action:manipulation}.k-card{background:var(--k-surface);border:var(--k-border);border-radius:var(--k-radius-lg);padding:var(--k-pad);box-shadow:0 4px 20px #00000026}.k-btn{display:flex;align-items:center;justify-content:center;gap:12px;min-height:var(--k-btn-height);padding:16px 28px;border-radius:var(--k-radius);border:3px solid transparent;font-family:var(--k-font-base);font-size:var(--k-text-lg);font-weight:600;cursor:pointer;transition:transform .1s,opacity .1s;text-align:center;width:100%;-webkit-tap-highlight-color:transparent}.k-btn:active{transform:scale(.97);opacity:.88}.k-btn-primary{background:var(--k-accent);color:#fff;border-color:var(--k-accent)}.k-btn-success{background:#16a34a;color:#fff;border-color:#16a34a}.k-btn-danger{background:#dc2626;color:#fff;border-color:#dc2626}.k-btn-ghost{background:transparent;color:var(--k-text);border-color:var(--k-text-muted)}.k-btn-dark{background:#111;color:#fff;border-color:#333}.k-con-btn{display:flex;width:100%;border:3px solid var(--btn-color);border-radius:var(--k-radius);overflow:hidden;cursor:pointer;background:none;padding:0;transition:transform .1s,box-shadow .15s;min-height:var(--k-btn-height-lg);box-shadow:0 3px 12px #0000001a}.k-con-btn:active{transform:scale(.985)}.k-con-btn:hover{box-shadow:0 6px 24px #0000002e}.k-con-label{flex:0 0 200px;display:flex;align-items:center;justify-content:center;padding:20px 16px;font-size:var(--k-text-xl);font-weight:700;text-align:center}.k-con-desc{flex:1;display:flex;align-items:center;justify-content:center;padding:20px 24px;background:#fff;color:#1e293b;font-size:var(--k-text-base);text-align:center;font-weight:500;border-left:3px solid var(--btn-color)}.k-input{width:100%;height:var(--k-input-height);background:#111;border:3px solid #333;border-radius:var(--k-radius);color:#fff;font-size:var(--k-text-lg);font-family:var(--k-font-base);padding:0 20px;outline:none;transition:border-color .2s}.k-input:focus{border-color:var(--k-accent)}.k-input::placeholder{color:#555}.k-tile-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--k-gap)}.k-tile{background:#111;border:3px solid #222;border-radius:var(--k-radius-lg);padding:24px 16px;display:flex;flex-direction:column;align-items:center;gap:14px;cursor:pointer;transition:border-color .18s,transform .1s,background .18s;color:#fff;position:relative;min-height:160px}.k-tile:hover,.k-tile:active{border-color:var(--k-accent);background:#1a2a3a;transform:scale(1.03)}.k-tile-icon{width:88px;height:88px;object-fit:cover;border-radius:14px}.k-tile-label{font-size:var(--k-text-sm);font-weight:600;text-align:center;color:#ffffffe6;line-height:1.3}.k-numpad{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.k-num-btn{background:#1a1a1a;border:3px solid #2a2a2a;border-radius:var(--k-radius);color:#fff;font-size:var(--k-text-2xl);font-weight:500;height:80px;cursor:pointer;font-family:var(--k-font-base);transition:background .12s,transform .08s}.k-num-btn:active{background:#2a2a2a;transform:scale(.95)}.k-num-btn.clear{color:#f87171}.k-num-btn.back{color:#94a3b8;font-size:24px}.k-header{display:flex;align-items:center;justify-content:space-between;padding:16px var(--k-pad);border-bottom:3px solid #1e293b;background:#0000004d}.k-page-title{background:#000;color:gold;padding:20px;font-size:var(--k-text-2xl);font-weight:700;text-align:center;letter-spacing:.04em;border-bottom:3px solid #333}.k-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:999px;font-size:var(--k-text-xs);font-weight:600;border:2px solid transparent}.k-badge-success{background:var(--hub-success-bg, rgba(34,197,94,.12));color:var(--k-success);border-color:var(--hub-success-border, rgba(34,197,94,.3))}.k-badge-warning{background:var(--hub-warning-bg, rgba(245,158,11,.12));color:var(--k-warning);border-color:var(--hub-warning-border, rgba(245,158,11,.3))}.k-badge-danger{background:var(--hub-danger-bg, rgba(239,68,68,.12));color:var(--k-danger);border-color:var(--hub-danger-border, rgba(239,68,68,.3))}.k-center{display:flex;align-items:center;justify-content:center}.k-col{display:flex;flex-direction:column}.k-row{display:flex;align-items:center}.k-gap{gap:var(--k-gap)}.k-full{width:100%}.k-text-muted{color:var(--k-text-muted);font-size:var(--k-text-sm)}.k-spinner{width:52px;height:52px;border:4px solid #333;border-top-color:var(--k-accent);border-radius:50%;animation:k-spin .8s linear infinite}@keyframes k-spin{to{transform:rotate(360deg)}}html,body,#app{min-height:100vh;overflow-x:hidden}