body{margin:0;padding:0}:root{--metal-dark:#2c3e50;--metal-light:#7f8c8d;--metal-highlight:#bdc3c7;--brass:#d4af37;--industrial-green:#2ecc71;--industrial-red:#e74c3c;--industrial-blue:#3498db;--font-industrial:"Courier New", Courier, monospace}body{color:var(--metal-highlight);font-family:var(--font-industrial);overscroll-behavior-y:contain;background-color:#1a1a1a;margin:0;overflow-x:hidden}.app-shell{min-height:100dvh}.mobile-bottom-nav{display:none}.mobile-panel,.mobile-section{display:block}.topbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 2rem 0;display:flex}.topbar-brand{flex-wrap:wrap;align-items:center;gap:1rem;display:flex}.topbar-title{color:var(--brass);text-transform:uppercase;letter-spacing:.08em;font-size:1.3rem;font-weight:700}.topbar-subtitle{color:var(--metal-light);font-size:.8rem}.status-pill{color:#ffd3cd;background:#e74c3c29;border:1px solid #e74c3c73;border-radius:999px;padding:.45rem .8rem;font-size:.78rem}.auth-chip{color:#fff;cursor:pointer;font:inherit;background:#00000059;border:1px solid #d4af3759;border-radius:999px;align-items:center;gap:.5rem;padding:.7rem .95rem;display:inline-flex}.auth-chip-email{color:var(--metal-light);text-overflow:ellipsis;white-space:nowrap;max-width:220px;overflow:hidden}.auth-required-card{text-align:center;flex-direction:column;align-items:center;gap:.75rem;padding:1.4rem;display:flex}.auth-required-wide{justify-content:center;min-height:320px}.loading-state{min-height:100vh;color:var(--brass);justify-content:center;align-items:center;font-size:1.1rem;display:flex}.app-container{box-sizing:border-box;background:radial-gradient(circle,#2c3e50 0%,#000 100%);flex-direction:row;align-items:flex-start;gap:2rem;min-height:100dvh;padding:2rem;display:flex}.left-column{flex-direction:column;flex-shrink:0;width:350px;display:flex}.control-panel{box-sizing:border-box;background:linear-gradient(145deg,#34495e,#2c3e50);border:8px solid #1a1a1a;border-radius:20px;flex-direction:column;align-items:center;width:100%;margin-bottom:2rem;padding:1.5rem;display:flex;box-shadow:10px 10px 20px #000,inset 2px 2px 5px #ffffff1a}.clock-display{color:#f39c12;text-shadow:0 0 10px #f39c12;text-align:center;box-sizing:border-box;background:#000;border:4px solid #333;border-radius:10px;width:100%;margin-bottom:1.2rem;padding:.8rem 1.2rem;font-size:2.2rem;box-shadow:inset 0 0 15px #f39c124d}.punch-button{background:radial-gradient(circle, var(--industrial-red), #c0392b);color:#fff;cursor:pointer;text-transform:uppercase;border:10px solid #1a1a1a;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:160px;height:160px;margin:0 auto 1.5rem;font-size:1.2rem;font-weight:700;transition:all .1s;display:flex;box-shadow:0 10px #922b21,0 15px 20px #00000080}.punch-button:active{transform:translateY(8px);box-shadow:0 2px #922b21,0 5px 10px #00000080}.punch-button.active{background:radial-gradient(circle, var(--industrial-green), #27ae60);box-shadow:0 10px #1e8449,0 15px 20px #00000080}.punch-button.active:active{transform:translateY(8px);box-shadow:0 2px #1e8449,0 5px 10px #00000080}.calendar-container{box-sizing:border-box;background:#2c3e50cc;border:4px solid #34495e;border-radius:15px;flex-grow:1;min-width:0;height:fit-content;padding:1.5rem}.calendar-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.5rem;display:flex}.calendar-header-main{flex-wrap:wrap;align-items:center;gap:1.5rem;display:flex}.calendar-badge-row{flex-wrap:wrap;align-items:stretch;gap:.75rem;display:flex}.calendar-header-actions{flex-wrap:wrap;gap:1rem;display:flex}.calendar-grid{flex-direction:column;gap:15px;display:flex}.calendar-week-row{grid-template-columns:130px minmax(0,1fr);align-items:stretch;gap:15px;display:grid}.calendar-week-grid{grid-template-columns:repeat(7,minmax(0,1fr));gap:15px;display:grid}.week-summary-tile{text-transform:uppercase;background:linear-gradient(145deg,#233140,#1a1a1a);border:2px solid #333;border-radius:15px;flex-direction:column;justify-content:center;gap:.35rem;padding:1rem;display:flex}.week-summary-label{color:var(--brass);font-size:.9rem;font-weight:700}.week-summary-total{color:var(--industrial-green);font-size:1.2rem;font-weight:700}.day-tile{aspect-ratio:1;cursor:pointer;background:#1a1a1a;border:2px solid #333;border-radius:15px;flex-direction:column;transition:transform .2s;display:flex;overflow:hidden}.day-tile:hover{transform:scale(1.05)}.day-tile-outside-month{opacity:.45}.day-tile-header{color:#fff;background:#34495e;border-bottom:1px solid #1a1a1a;justify-content:center;align-items:center;height:20%;font-size:.8rem;display:flex;position:relative}.day-tile-colors{background:#1a1a1a;flex-direction:column;flex-grow:1;font-size:.7rem;display:flex}.color-segment{border-bottom:1px solid #222;flex-grow:1;align-items:center;width:100%;min-height:20px;display:flex;position:relative}.color-strip{width:6.25%;height:100%;position:absolute;top:0;left:0}.segment-time{text-align:center;color:#ccc;pointer-events:none;width:100%;font-weight:700}.monthly-total-badge{color:var(--metal-highlight);letter-spacing:.04em;white-space:nowrap;background:#00000059;border:1px solid #4f657a;border-radius:999px;min-width:0;padding:.6rem .85rem;font-size:.8rem;font-weight:700}.segment-editor-row{align-items:center;gap:.75rem;margin-bottom:.65rem;display:flex}.segment-editor-label{flex:0 0 52px;width:52px;font-size:.8rem}.compact-date-time-row{grid-template-columns:96px 132px auto 96px 132px;justify-content:start;align-items:center;gap:.45rem;width:100%;min-width:0;display:grid}.compact-date-time-row-entry{grid-template-columns:96px 132px}.compact-date-input,.compact-time-input{width:100%;min-height:46px;margin:0;font-size:.95rem;padding:.6rem .7rem!important}.compact-date-input{text-transform:uppercase}.segment-divider{color:var(--metal-highlight);text-align:center}.entry-time-range{gap:1rem;margin-bottom:1rem;display:flex}.entry-time-block{flex:1;min-width:0}.year-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;display:grid}.mini-month-card{color:var(--metal-highlight);text-align:left;cursor:pointer;background:#18212b;border:2px solid #31475a;border-radius:16px;padding:1rem;transition:transform .15s,border-color .15s}.mini-month-card:hover{border-color:var(--brass);transform:translateY(-2px)}.mini-month-card-header{color:#fff;justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:.75rem;font-size:.9rem;font-weight:700;display:flex}.mini-month-weekdays,.mini-month-grid{grid-template-columns:repeat(7,minmax(0,1fr));gap:.25rem;display:grid}.mini-month-weekdays{color:var(--metal-light);text-align:center;margin-bottom:.35rem;font-size:.7rem}.mini-month-day{color:#d5dadd;background:#10161d;border-radius:8px;justify-content:center;align-items:center;min-height:28px;font-size:.72rem;display:flex}.mini-month-day-outside{opacity:.25}.mini-month-day-active{color:var(--industrial-green);background:#2ecc7133;border:1px solid #2ecc7173}.day-tile-current{box-shadow:inset 0 0 0 2px #e74c3ce6}.day-tile-current .day-tile-header{background:linear-gradient(#e74c3c61,#34495e)}.mini-month-day-current{border:2px solid var(--industrial-red);color:#fff;box-shadow:inset 0 0 0 1px #e74c3c40}.modal-overlay{z-index:1000;background:#000000d9;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{border:6px solid var(--metal-light);background:#34495e;border-radius:15px;width:500px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);padding:2rem;overflow-y:auto;box-shadow:0 0 30px #00000080}.modal-content h2{color:var(--brass);margin-top:0}.auth-modal{width:420px;max-width:calc(100vw - 32px)}.day-preview-modal{width:360px;max-width:calc(100vw - 24px)}.day-preview-tile{aspect-ratio:1;width:100%;max-width:100%;margin-bottom:1rem}.day-preview-empty{color:var(--metal-light);flex:1;justify-content:center;align-items:center;font-size:.9rem;display:flex}.auth-panel{flex-direction:column;gap:1rem;display:flex}.auth-mode-switch{gap:.75rem;margin-bottom:1rem;display:flex}.auth-feedback{border-radius:10px;margin-bottom:.75rem;padding:.75rem .9rem;font-size:.9rem}.auth-feedback-error{color:#ffd7d1;background:#e74c3c2e;border:1px solid #e74c3c73}.auth-feedback-info{color:#d8efff;background:#3498db2e;border:1px solid #3498db73}.auth-input{height:auto;min-height:52px}.auth-secondary-button{background:#95a5a6;width:100%;margin-top:.75rem}.export-button{align-items:center;gap:.5rem;display:inline-flex}.category-select{color:#fff;border:2px solid var(--metal-light);background:#1a1a1a;border-radius:5px;width:100%;margin:1rem 0;padding:1rem}.note-input{color:#fff;border:2px solid var(--metal-light);resize:none;box-sizing:border-box;background:#1a1a1a;border-radius:5px;width:100%;height:100px;margin-bottom:1rem;padding:1rem}input.note-input{height:auto;min-height:56px;padding:.85rem 1rem}textarea.note-input{min-height:100px}.confirm-button{background:var(--industrial-green);color:#fff;cursor:pointer;border:none;border-radius:5px;width:100%;padding:1rem;font-size:1.2rem;font-weight:700}.break-controls{gap:1rem;margin-top:1rem;display:flex}.break-button{background:var(--brass);color:#000;cursor:pointer;border:none;border-radius:5px;padding:.5rem 1rem;font-weight:700}.break-button.active{background:#f1c40f;animation:1s infinite pulse}@keyframes pulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}.settings-panel{box-sizing:border-box;background:linear-gradient(#0e141bf5,#181f28fa);border:1px solid #7f8c8d40;border-radius:16px;width:100%;padding:1.25rem;box-shadow:inset 0 1px #ffffff0a}.settings-panel-header{justify-content:space-between;align-items:baseline;gap:.75rem;margin-bottom:.9rem;display:flex}.settings-panel-subtitle{color:var(--metal-light);text-transform:uppercase;letter-spacing:.08em;font-size:.72rem}.color-picker-grid{grid-template-columns:1fr;gap:.7rem;display:grid}.color-picker-item{background:#ffffff08;border:1px solid #7f8c8d2e;border-radius:12px;align-items:stretch;gap:.8rem;padding:.7rem .8rem;font-size:.85rem;display:flex}.color-input{cursor:pointer;background:#10161d;border:2px solid #ffffff14;border-radius:10px;flex:none;width:36px;height:36px;padding:0}.category-row-content,.category-edit-row{flex-direction:column;flex:1;justify-content:space-between;align-items:stretch;gap:.75rem;min-width:0;display:flex}.category-name{color:#ecf0f1;letter-spacing:.01em;white-space:normal;overflow-wrap:anywhere;font-weight:700;line-height:1.25}.category-actions{flex-wrap:nowrap;justify-content:space-between;align-items:flex-end;gap:.45rem;width:100%;display:flex}.category-action-button{text-transform:uppercase;letter-spacing:.05em;min-width:88px;padding:.38rem .65rem;font-size:.72rem}.category-action-button-muted{color:#fff;background:#6f7c87}.category-action-button-danger{background:var(--industrial-red);color:#fff}.category-name-input{color:#fff;box-sizing:border-box;width:100%;min-width:0;height:36px;font:inherit;background:#0f151c;border:1px solid #7f8c8d59;border-radius:10px;padding:.55rem .75rem}.category-name-input:focus{border-color:var(--brass);outline:none;box-shadow:0 0 0 2px #d4af372e}.category-create-row{align-items:center;gap:.55rem;margin-top:.9rem;display:flex}.category-create-input{flex:1}.category-create-button{text-transform:uppercase;letter-spacing:.05em;flex:none;height:36px;padding:0 .9rem}@media (width<=1024px){.calendar-week-row{grid-template-columns:1fr}.year-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=900px){html,body{overscroll-behavior-y:contain;min-height:100%}.topbar{padding:1rem 1rem 0}.app-container{flex-direction:column;min-height:auto;padding:1rem 1rem 6.5rem}.left-column{width:100%;padding-bottom:1rem}.calendar-container{width:100%;padding:1rem;overflow:hidden}.mobile-panel{width:100%;display:none}.mobile-panel-active{display:block}.mobile-section{display:none}.mobile-section-active,.control-panel.mobile-section-active{display:flex}.settings-panel.mobile-section-active{margin-bottom:1rem;display:block}.calendar-container.mobile-panel-active{display:block}.calendar-header-main,.calendar-header-actions{width:100%}.calendar-badge-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;width:100%;display:grid}.monthly-total-badge{box-sizing:border-box;text-align:center;letter-spacing:.02em;width:100%;padding:.55rem .65rem;font-size:.72rem}.calendar-header-actions{gap:.6rem}.calendar-header-actions .break-button{flex:calc(50% - .3rem);justify-content:center}.calendar-week-row{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.week-summary-tile{aspect-ratio:1;border-radius:12px;justify-content:space-between;align-items:flex-start;min-width:0;padding:.55rem}.week-summary-label{font-size:.75rem}.week-summary-total{font-size:1rem;line-height:1.1}.calendar-week-grid{display:contents}.mobile-bottom-nav{z-index:1100;padding:.85rem 1rem calc(.85rem + env(safe-area-inset-bottom,0px));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(#080b0feb,#0c1016fa);border-top:1px solid #7f8c8d2e;grid-template-columns:1fr 1.2fr 1fr;gap:.75rem;display:grid;position:fixed;bottom:0;left:0;right:0}.mobile-bottom-button{min-height:56px;color:var(--metal-highlight);font:inherit;cursor:pointer;background:#ffffff0d;border:1px solid #7f8c8d38;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:.2rem;display:flex}.mobile-bottom-button span{text-transform:uppercase;letter-spacing:.04em;font-size:.72rem}.mobile-bottom-button-active{border-color:var(--brass);color:#fff;box-shadow:inset 0 0 0 1px #d4af372e}.mobile-bottom-button-primary{background:radial-gradient(circle,#2ecc7138,#27ae601f);border-color:#2ecc7166}.mobile-bottom-button-primary.mobile-bottom-button-active{border-color:var(--industrial-green);background:radial-gradient(circle,#2ecc7159,#27ae602e)}.calendar-week-grid{gap:8px}.day-tile{aspect-ratio:1;min-width:0}.mobile-day-tile{aspect-ratio:1}.day-tile-header{justify-content:center;font-size:.74rem;gap:.1rem!important;height:100%!important}.segment-time{font-size:.82rem}.mobile-day-tile .day-tile-header span:first-child{font-size:.7rem}.mobile-day-tile .day-tile-header span:nth-child(2){font-size:1.15rem;font-weight:700}.mobile-day-tile .day-tile-header span:last-child,.mobile-day-tile .day-tile-colors{display:none}.color-segment{min-height:28px}.modal-overlay{box-sizing:border-box;align-items:flex-start;padding:12px;overflow-y:auto}.modal-content{width:100%;max-width:100%;max-height:none;margin:0 auto calc(5.5rem + env(safe-area-inset-bottom,0px));border-width:4px;padding:1rem}.segments-editor{overflow-x:visible}.segment-editor-row{flex-direction:column;align-items:stretch;gap:.35rem}.segment-editor-label{flex-basis:auto;width:auto;padding-top:0;font-size:.72rem}.compact-date-time-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:.3rem}.segment-divider{display:none}.compact-date-time-row>.compact-date-input:nth-of-type(2),.compact-date-time-row>.compact-time-input:last-child{display:block}.compact-date-input,.compact-time-input{width:100%;min-height:36px;font-size:.8rem;padding:.45rem .4rem!important}.entry-time-range{flex-direction:column;gap:.75rem}.compact-date-time-row-entry{grid-template-columns:minmax(0,1fr) 92px}.note-input{min-height:88px}input.note-input{min-height:48px;padding:.75rem .85rem}.auth-input{min-height:46px}.year-grid{grid-template-columns:1fr}.settings-panel-header,.category-row-content,.category-edit-row,.category-create-row{flex-direction:column;align-items:stretch}.category-actions{justify-content:flex-start}}