:root{--coc-bg-dark: #1a0f00;--coc-bg-wood: #3d1f00;--coc-border-gold: #c8902a;--coc-border-dark-gold: #7a5010;--coc-btn-green: #5a9e2f;--coc-btn-green-dark: #3a6e1f;--coc-btn-red: #c0392b;--coc-btn-blue: #2980b9;--coc-text-gold: #ffe066;--coc-text-white: #ffffff;--coc-text-shadow: #000000}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;background-color:var(--coc-bg-dark);color:var(--coc-text-white);font-family:Arial Bold,Arial,sans-serif;height:100%;overflow:hidden;touch-action:manipulation}#app{height:100%}.coc-btn{display:inline-flex;align-items:center;justify-content:center;padding:10px 24px;border-radius:8px;border:3px solid var(--coc-border-gold);background:linear-gradient(180deg,#5a3a0a,#3d2206,#2e1a04);color:var(--coc-text-gold);font-family:Arial Black,Arial,sans-serif;font-size:1rem;font-weight:900;text-shadow:2px 2px 0 var(--coc-text-shadow);cursor:pointer;-webkit-user-select:none;user-select:none;transition:transform .08s ease,box-shadow .08s ease;box-shadow:0 4px 0 var(--coc-border-dark-gold),0 6px 12px #00000080;outline:none;-webkit-tap-highlight-color:transparent}.coc-btn:hover{filter:brightness(1.1)}.coc-btn:active{transform:translateY(2px);box-shadow:0 2px 0 var(--coc-border-dark-gold),0 3px 6px #0006}.coc-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.coc-btn--green{background:linear-gradient(180deg,#7ec44a,#5a9e2f,#3a6e1f);border-color:#4a8020;box-shadow:0 4px #2a5010,0 6px 12px #00000080}.coc-btn--red{background:linear-gradient(180deg,#e05050,#c0392b,#8a2010);border-color:#8a2010;box-shadow:0 4px #5a1008,0 6px 12px #00000080}.coc-panel{background:linear-gradient(180deg,var(--coc-bg-wood) 0%,#2a1200 100%);border:3px solid var(--coc-border-gold);border-radius:10px;box-shadow:inset 0 1px #ffdc6426,0 4px 16px #0009;padding:12px}.coc-tool-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:6px;border:2px solid var(--coc-border-gold);background:linear-gradient(180deg,#4a2a06,#2e1a04);color:var(--coc-text-white);font-size:1.2rem;cursor:pointer;transition:transform .08s ease;-webkit-tap-highlight-color:transparent}.coc-tool-btn:active{transform:translateY(1px)}.coc-tool-btn--active{border-color:var(--coc-text-gold);background:linear-gradient(180deg,#7a5010,#5a3a00);box-shadow:0 0 8px #c8902a99}