:root{--ds-control-bg: transparent;--ds-control-border: #444;--ds-control-text: #fff;--ds-control-radius: 8px;--ds-control-padding: .75rem 1.5rem;--ds-button-text: #e0e0e0;--ds-button-success: #00a000;--ds-button-primary: #007bff;--ds-button-danger: #a00000;--ds-button-warning: #ff8c00;--ds-button-muted: #ccc;--ds-button-neutral: #121212;--ds-button-neutral-border: #888;--ds-button-ghost-hover: rgba(255, 255, 255, .08);--ds-button-gap: .5rem}.app-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--ds-button-gap, .5rem);min-height:2.75rem;background:transparent;border:1px solid var(--ds-control-border, #444);color:var(--ds-button-text, #e0e0e0);border-radius:var(--ds-control-radius, 8px);padding:var(--ds-control-padding, .75rem 1.5rem);box-sizing:border-box;cursor:pointer;line-height:1;text-decoration:none;transition:background-color .2s,border-color .2s,color .2s,filter .2s,opacity .2s,box-shadow .2s}.app-btn:hover,.app-btn:not(:disabled):hover{filter:brightness(1.3)}.app-btn:disabled,.app-btn[aria-disabled=true]{cursor:not-allowed;filter:none;opacity:.5}.app-btn img{width:16px;height:16px;object-fit:contain}.app-btn--primary{background:var(--ds-button-primary, #007bff);border-color:var(--ds-button-primary, #007bff);color:var(--ds-button-text, #e0e0e0)}.app-btn--success{background:var(--ds-button-success, #00a000);border-color:var(--ds-button-success, #00a000);color:var(--ds-button-text, #e0e0e0)}.app-btn--danger{background:var(--ds-button-danger, #a00000);border-color:var(--ds-button-danger, #a00000);color:var(--ds-button-text, #e0e0e0)}.app-btn--warning{background:var(--ds-button-warning, #ff8c00);border-color:var(--ds-button-warning, #ff8c00);color:var(--ds-button-text, #e0e0e0)}.app-btn--ghost{background:transparent;border-color:var(--ds-control-border, #444);color:var(--ds-button-text, #e0e0e0)}.app-btn--ghost:not(:disabled):hover{background:var(--ds-button-ghost-hover, rgba(255, 255, 255, .08))}.app-btn--muted{background:transparent;border-color:var(--ds-control-border, #444);color:var(--ds-button-muted, #ccc)}.app-btn--neutral,.app-btn--secondary{background:var(--ds-button-neutral, #121212);border-color:var(--ds-button-neutral-border, #888);color:var(--ds-button-text, #e0e0e0)}.app-btn--icon{min-width:2.75rem;width:2.75rem;padding:.75rem}.app-btn--icon img,.tutorial-btn img{width:16px;height:16px}.app-btn--wide{min-width:180px}.app-btn--block{display:flex;width:100%}.app-btn--hero{min-width:200px;padding:clamp(8px,1.5vh,16px) clamp(16px,3vh,32px);font-size:clamp(14px,1.7vh,18px);font-weight:600}.app-btn--tab{font-size:16px;font-weight:600;border-radius:10px}.app-btn--active,.app-btn.active{background:#006400;color:#ecfdf3;box-shadow:0 0 0 2px #22c55e59}.button-row,.groups-actions,.sync-actions,.mobile-actions,.modal-actions,.actions{display:flex;align-items:center;gap:var(--ds-button-gap, .5rem)}.modal-actions,.actions{justify-content:flex-end}html,body{height:100%}body{margin:0;font-family:Segoe UI,Roboto,Helvetica Neue,sans-serif;background-color:#04080a;color:#e0e0e0;overflow-x:hidden}.green{color:#006400}.modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background:#1e1e1e;color:#e0e0e0;padding:1rem;border-radius:8px;box-shadow:0 4px 12px #00000080;min-width:300px}.modal-actions{margin-top:1rem;text-align:right}.risk-checkbox{display:flex;align-items:center}.risk-checkbox input{margin-right:.5rem}.tutorial-spotlight{position:fixed;inset:auto;margin:0;display:none;z-index:2147483646;pointer-events:none;padding:0;background:transparent;color:transparent;border:2px solid #fff;border-radius:10px;box-sizing:border-box;box-shadow:0 0 0 9999px #000000b8,0 0 18px #ffffff8c;transition:top .15s ease,left .15s ease,width .15s ease,height .15s ease}.tutorial-spotlight::backdrop,.tutorial-bubble::backdrop{background:transparent;pointer-events:none}.tutorial-bubble{position:fixed;inset:auto;margin:0;z-index:2147483647;pointer-events:auto;background:#1e1e1e;color:#e0e0e0;padding:1rem;border-radius:.5rem;border:1px solid #444;box-shadow:0 4px 12px #0009;width:min(320px,100vw - 20px);max-height:80vh;overflow-y:auto;font-size:clamp(.8rem,2.5vw,1rem);box-sizing:border-box;-webkit-overflow-scrolling:touch}.tutorial-bubble p{margin:0;line-height:1.5}.tutorial-buttons{display:flex;justify-content:flex-end;gap:.5rem;margin-top:1rem}.tutorial-buttons .app-btn{min-height:2.5rem;padding:.6rem 1rem}.tutorial-highlight{scroll-margin:6rem;outline:3px solid #fff;outline-offset:4px;border-radius:8px;box-shadow:0 0 20px #ffffff4d}@media (max-width: 600px){.tutorial-buttons{align-items:stretch;flex-direction:column-reverse}.tutorial-buttons .app-btn{width:100%}}
