:root{--paper: #f7f3e8;--paper-2: #efe9d8;--ink: #1c1c1a;--ink-soft: #4a4a44;--green-deep: #1e3b32;--green: #2c5245;--green-soft: #3d6858;--gold: #b08d3e;--gold-bright: #c9a961;--jade: #8fb5a5;--jade-soft: #e2ece7;--danger: #9c3b2e;--warn: #a2701f;--ok: #3d6b4f;--radius: 10px;--shadow: 0 1px 3px rgba(28, 28, 26, .12);--serif: "Noto Serif TC", "PMingLiU", "SimSun", serif;--sans: "Noto Sans TC", "Microsoft JhengHei", system-ui, sans-serif;--mono: "SF Mono", Consolas, monospace}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}#root{min-height:100%;display:flex;flex-direction:column}.app-header{background:var(--green-deep);color:var(--paper);padding:calc(env(safe-area-inset-top,0px) + 10px) 16px 10px;display:flex;align-items:baseline;gap:10px;position:sticky;top:0;z-index:20}.app-header h1{font-family:var(--serif);font-size:19px;font-weight:600;letter-spacing:2px}.app-header .ver{font-size:11px;color:var(--gold-bright);letter-spacing:1px}.app-main{flex:1;padding:14px 14px 90px;max-width:780px;width:100%;margin:0 auto}.app-nav{position:fixed;bottom:0;left:0;right:0;background:var(--green-deep);display:flex;overflow-x:auto;padding:4px 6px calc(env(safe-area-inset-bottom,0px) + 4px);z-index:20;scrollbar-width:none}.app-nav::-webkit-scrollbar{display:none}.app-nav a{color:var(--jade);text-decoration:none;font-size:12px;padding:8px 10px;border-radius:8px;white-space:nowrap;letter-spacing:1px}.app-nav a.active{color:var(--paper);background:var(--green);font-weight:600}.card{background:#fffdf6;border:1px solid var(--paper-2);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px 16px;margin-bottom:14px}.card h2{font-family:var(--serif);font-size:17px;color:var(--green-deep);border-bottom:1px solid var(--paper-2);padding-bottom:8px;margin-bottom:12px;letter-spacing:2px}.card h3{font-size:14px;color:var(--green);margin:10px 0 6px;letter-spacing:1px}.muted{color:var(--ink-soft);font-size:13px}.big-num{font-family:var(--mono);font-size:34px;color:var(--green-deep);font-weight:600}.mono{font-family:var(--mono)}label.field{display:block;margin-bottom:10px;font-size:13px;color:var(--ink-soft)}label.field span{display:block;margin-bottom:3px;letter-spacing:1px}input,select,textarea{width:100%;padding:8px 10px;border:1px solid #d8d2bf;border-radius:8px;background:#fffef9;font:inherit;color:var(--ink)}textarea{min-height:72px;resize:vertical}input:focus,select:focus,textarea:focus{outline:2px solid var(--jade);border-color:var(--jade)}button{font:inherit;padding:9px 18px;border-radius:8px;border:1px solid var(--green);background:var(--green);color:var(--paper);cursor:pointer;letter-spacing:2px}button:hover{background:var(--green-soft)}button.secondary{background:transparent;color:var(--green)}button.gold{background:var(--gold);border-color:var(--gold)}button.danger-btn{background:transparent;border-color:var(--danger);color:var(--danger)}button:disabled{opacity:.45;cursor:not-allowed}.btn-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.tag{display:inline-block;font-size:11px;padding:1px 8px;border-radius:999px;letter-spacing:1px;vertical-align:middle;border:1px solid transparent}.tag.mock{background:#f3e3c3;color:#7a5b18;border-color:#d9bf85}.tag.live{background:var(--jade-soft);color:var(--ok);border-color:var(--jade)}.tag.notimpl{background:#eee;color:#666;border-color:#ccc}.tag.human{background:#e8e0f0;color:#4a3a66;border-color:#c9b8de}.tag.candidate{background:#fdeeda;color:var(--warn);border-color:#e8c896}.banner{border-radius:8px;padding:10px 12px;font-size:13px;margin:10px 0;border:1px solid}.banner.warn{background:#fdf3e0;border-color:#e8c896;color:#7a5b18}.banner.danger{background:#fbe9e5;border-color:#dfa79c;color:var(--danger)}.banner.ok{background:var(--jade-soft);border-color:var(--jade);color:var(--ok)}.banner.info{background:#eef2ef;border-color:#c6d4cc;color:var(--green)}table.data{width:100%;border-collapse:collapse;font-size:13px}table.data th,table.data td{text-align:left;padding:6px 8px;border-bottom:1px solid var(--paper-2)}table.data th{color:var(--ink-soft);font-weight:500;letter-spacing:1px}.list-item{border:1px solid var(--paper-2);border-radius:8px;padding:10px 12px;margin-bottom:8px;background:#fffef9}.list-item .title{font-weight:600;color:var(--green-deep)}.kv{display:grid;grid-template-columns:auto 1fr;gap:2px 14px;font-size:13px}.kv dt{color:var(--ink-soft)}.kv dd{font-family:var(--mono)}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}@media(max-width:520px){.grid-2{grid-template-columns:1fr}}.compass-wrap{display:flex;flex-direction:column;align-items:center}.compass-svg{width:min(88vw,420px);height:auto}.lubber{fill:var(--danger)}.level-frame{width:min(70vw,280px);height:min(70vw,280px);border:2px solid var(--green);border-radius:50%;position:relative;margin:14px auto;background:radial-gradient(circle,#fffef9 55%,var(--jade-soft))}.level-bubble{width:34px;height:34px;border-radius:50%;background:var(--gold-bright);border:2px solid var(--gold);position:absolute;top:50%;left:50%;transition:transform .08s linear}.level-cross{position:absolute;background:#2c524540}@media print{.app-nav,.app-header,.no-print{display:none!important}.app-main{padding:0}.card{box-shadow:none;break-inside:avoid}}