.time-utilities{min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:transparent;position:relative}.time-utilities,.time-utilities *,.time-utilities :after,.time-utilities :before{box-sizing:border-box}.time-utilities__header{text-align:center;margin-bottom:3rem;padding:2rem 0}.time-utilities__header h1{font-size:3rem;font-weight:800;background:linear-gradient(135deg,var(--primary-red),var(--primary-red-light) 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:1rem;text-shadow:0 0 30px rgba(220,38,38,.3)}@media(max-width:768px){.time-utilities__header h1{font-size:2.5rem}}.time-utilities__header p{color:var(--dark-text-secondary);font-size:1.2rem;max-width:600px;margin:0 auto;opacity:.9}.time-utilities__tabs{display:flex;gap:.5rem;overflow-x:auto;padding:1rem;background:var(--dark-glass-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:2px solid hsla(0,0%,100%,.1);border-radius:16px;box-shadow:0 8px 32px rgba(0,0,0,.3);margin-bottom:2rem}.time-utilities__tabs::-webkit-scrollbar{height:6px}.time-utilities__tabs::-webkit-scrollbar-track{background:hsla(0,0%,100%,.1);border-radius:3px}.time-utilities__tabs::-webkit-scrollbar-thumb{background:var(--primary-blue);border-radius:3px}.time-utilities__tabs::-webkit-scrollbar-thumb:hover{background:var(--primary-blue-dark)}.time-utilities__tab{padding:1rem 1.5rem;border-radius:12px;font-weight:600;white-space:nowrap;transition:all .3s cubic-bezier(.4,0,.2,1);border:1px solid hsla(0,0%,100%,.1);position:relative;overflow:hidden;background:hsla(0,0%,100%,.05);color:var(--dark-text-secondary);cursor:pointer}.time-utilities__tab:hover{transform:translateY(-2px);background:hsla(0,0%,100%,.1);color:var(--dark-text-primary);border-color:hsla(0,0%,100%,.2)}.time-utilities__tab--active{color:#fff;border-color:hsla(0,0%,100%,.3)}.time-utilities__tab--active,.time-utilities__tab--active:hover{background:var(--gradient-primary);transform:translateY(-2px)}.time-utilities__content{background:var(--dark-glass-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:2px solid hsla(0,0%,100%,.1);border-radius:20px;box-shadow:0 8px 32px rgba(0,0,0,.4);padding:2.5rem;position:relative;width:100%;max-width:100%}.time-utilities__content:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--primary-blue),var(--primary-purple),var(--accent-teal),var(--primary-blue));border-radius:20px 20px 0 0}.time-utilities__form-group{margin-bottom:1.5rem;width:100%}.time-utilities__form-group label{display:block;font-weight:600;color:var(--dark-text-primary);margin-bottom:.75rem;font-size:.9rem;text-transform:uppercase;letter-spacing:.1em}.time-utilities__form-group input,.time-utilities__form-group select,.time-utilities__form-group textarea{width:100%;max-width:100%;padding:1rem 1.25rem;border:1px solid var(--dark-border-color);border-radius:12px;transition:all .3s ease;font-size:1rem;background:var(--dark-bg-secondary);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-sizing:border-box;color:var(--dark-text-primary);font-weight:500}.time-utilities__form-group input:focus,.time-utilities__form-group select:focus,.time-utilities__form-group textarea:focus{outline:none;border-color:var(--primary-blue);box-shadow:0 0 0 3px rgba(59,130,246,.2);background:var(--dark-bg-primary);transform:translateY(-1px)}.time-utilities__form-group input:hover,.time-utilities__form-group select:hover,.time-utilities__form-group textarea:hover{border-color:var(--primary-blue);background:var(--dark-bg-primary)}.time-utilities__form-group input.error,.time-utilities__form-group select.error,.time-utilities__form-group textarea.error{border-color:var(--primary-red);box-shadow:0 0 0 3px rgba(220,38,38,.3)}.time-utilities__form-group input::placeholder,.time-utilities__form-group select::placeholder,.time-utilities__form-group textarea::placeholder{color:var(--dark-text-tertiary);opacity:.7}.time-utilities__form-group .modern-select{position:relative;width:100%}.time-utilities__form-group .modern-select select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--dark-bg-secondary);border:1px solid var(--dark-border-color);border-radius:12px;padding:1rem 3rem 1rem 1.25rem;font-weight:600;color:var(--dark-text-primary);cursor:pointer;transition:all .3s ease;width:100%}.time-utilities__form-group .modern-select select:hover{border-color:var(--primary-blue);background:var(--dark-bg-primary);transform:translateY(-2px);box-shadow:0 4px 20px rgba(59,130,246,.15)}.time-utilities__form-group .modern-select select:focus{outline:none;border-color:var(--primary-blue);box-shadow:0 0 0 3px rgba(59,130,246,.2);background:var(--dark-bg-primary);transform:translateY(-1px)}.time-utilities__form-group .modern-select:before{content:"";position:absolute;top:50%;right:1.25rem;transform:translateY(-50%);width:12px;height:12px;background:var(--dark-text-secondary);-webkit-clip-path:polygon(0 0,100% 0,50% 100%);clip-path:polygon(0 0,100% 0,50% 100%);transition:all .3s ease;pointer-events:none;z-index:2}.time-utilities__form-group .modern-select:hover:before{background:var(--primary-blue);transform:translateY(-50%) scale(1.2)}select:focus~.time-utilities__form-group .modern-select:before{background:var(--primary-blue);transform:translateY(-50%) rotate(180deg) scale(1.2)}.time-utilities__form-group .error-message{color:var(--primary-red);font-size:.875rem;margin-top:.5rem;display:flex;align-items:center;gap:.5rem}.time-utilities__form-group .error-message:before{content:"⚠";font-size:1rem}.time-utilities__card{background:var(--dark-glass-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid hsla(0,0%,100%,.1);border-radius:16px;padding:2rem;box-shadow:0 8px 32px rgba(0,0,0,.3);transition:all .3s ease;width:100%;max-width:100%;margin-bottom:2rem}.time-utilities__card:hover{transform:translateY(-4px);box-shadow:0 12px 40px rgba(0,0,0,.4);border-color:hsla(0,0%,100%,.2)}.time-utilities__card h3,.time-utilities__card h4{color:var(--dark-text-primary);font-weight:700;margin-bottom:1.5rem;font-size:1.5rem}.time-utilities__card--info{background:var(--dark-bg-secondary);border-color:hsla(0,0%,100%,.05)}.time-utilities__card--info:hover{transform:none;box-shadow:0 8px 32px rgba(0,0,0,.3)}.time-utilities__output-group{position:relative;width:100%;margin-bottom:1.5rem}.time-utilities__output-group label{display:block;font-weight:600;color:var(--dark-text-primary);margin-bottom:.75rem;font-size:.9rem;text-transform:uppercase;letter-spacing:.1em}.time-utilities__output-group .output-field{display:flex;width:100%;max-width:100%}.time-utilities__output-group .output-field input{flex:1 1;min-width:0;border-right:none;border-radius:12px 0 0 12px;background:var(--dark-bg-secondary);color:var(--dark-text-primary);font-family:Monaco,Menlo,Ubuntu Mono,monospace;border:1px solid var(--dark-border-color)}.time-utilities__output-group .output-field input:focus{background:var(--dark-bg-primary);border-color:var(--primary-blue);box-shadow:0 0 0 3px rgba(59,130,246,.2)}.time-utilities__output-group .output-field .copy-button{flex-shrink:0;padding:1rem 1.5rem;background:var(--gradient-primary);color:#fff;border:1px solid var(--primary-blue);border-radius:0 12px 12px 0;transition:all .3s ease;font-weight:600;cursor:pointer;position:relative;overflow:hidden;white-space:nowrap}.time-utilities__output-group .output-field .copy-button:before{content:"📋";margin-right:.5rem}.time-utilities__output-group .output-field .copy-button:hover{background:var(--gradient-secondary);transform:translateX(2px);box-shadow:0 4px 20px rgba(59,130,246,.3)}.time-utilities__output-group .output-field .copy-button.copied{background:linear-gradient(135deg,var(--accent-green),#15803d);border-color:var(--accent-green)}.time-utilities__output-group .output-field .copy-button.copied:before{content:"✓"}.time-utilities__button{padding:1rem 1.5rem;border-radius:12px;font-weight:600;transition:all .3s ease;border:1px solid transparent;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;text-decoration:none;position:relative;overflow:hidden;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.time-utilities__button--primary{background:var(--gradient-primary);color:#fff;border-color:var(--primary-blue);box-shadow:0 4px 20px rgba(59,130,246,.2)}.time-utilities__button--primary:hover{background:var(--gradient-secondary);transform:translateY(-2px);box-shadow:0 8px 30px rgba(59,130,246,.4)}.time-utilities__button--success{background:linear-gradient(135deg,var(--accent-green),#15803d);color:#fff;border-color:var(--accent-green)}.time-utilities__button--success:hover{background:linear-gradient(135deg,#15803d,#047857);transform:translateY(-2px)}.time-utilities__button--secondary{background:var(--dark-bg-secondary);color:var(--dark-text-primary);border-color:var(--dark-border-color)}.time-utilities__button--secondary:hover{background:var(--dark-bg-tertiary);transform:translateY(-2px);border-color:var(--primary-blue)}.time-utilities__button--small{padding:.5rem 1rem;font-size:.875rem;border-radius:8px}.time-utilities__button-group{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}.time-utilities__button-group .time-utilities__button{flex:1 1;min-width:120px}@media(max-width:768px){.time-utilities__button-group .time-utilities__button{flex:none;width:100%}}.time-utilities__grid{display:grid;grid-gap:2rem;gap:2rem;width:100%}.time-utilities__grid--1-2{grid-template-columns:1fr 1fr}@media(max-width:1024px){.time-utilities__grid--1-2{grid-template-columns:1fr}}.time-utilities__grid--1-3{grid-template-columns:repeat(3,1fr)}@media(max-width:1024px){.time-utilities__grid--1-3{grid-template-columns:1fr 1fr}}@media(max-width:768px){.time-utilities__grid--1-3{grid-template-columns:1fr}}.time-utilities .info-box{background:var(--dark-bg-secondary);border:1px solid var(--dark-border-color);border-radius:12px;padding:1.5rem;margin-top:1rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.time-utilities .info-box h4,.time-utilities .info-box p{color:var(--dark-text-primary);margin-bottom:1rem}.time-utilities .info-box ul{list-style:none;padding:0;margin:0}.time-utilities .info-box ul li{padding:.5rem 0;color:var(--dark-text-secondary);font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.9rem}.time-utilities .info-box ul li:before{content:"• ";color:var(--primary-blue);margin-right:.5rem}@media(max-width:768px){.time-utilities__content{padding:1.5rem;margin:0 1rem}.time-utilities__header{margin-bottom:2rem;padding:1rem 0}.time-utilities__header h1{font-size:2.5rem}.time-utilities__header p{font-size:1rem}.time-utilities__tabs{padding:.5rem;margin:0 1rem 2rem}.time-utilities__tab{padding:.75rem 1rem;font-size:.9rem}.time-utilities__card{padding:1.5rem}}.time-utilities .space-y-4>*+*{margin-top:1rem}.time-utilities .space-y-6>*+*{margin-top:1.5rem}.time-utilities .font-mono{font-family:Monaco,Menlo,Ubuntu Mono,monospace}.time-utilities .text-sm{font-size:.875rem}.time-utilities .opacity-75{opacity:.75}.time-utilities .text-xs{font-size:.75rem}.time-utilities .overflow-auto{overflow:auto}header{height:var(--header-height);display:flex;align-items:center;font-weight:700;border-bottom:1px solid var(--dark-glass-border);padding:0 3em;width:100%;box-sizing:border-box;border-radius:0;background:var(--dark-glass-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 1px 3px rgba(0,0,0,.3);margin:0 auto;position:relative;z-index:10}@media screen and (max-width:900px){header{padding:0 1.2em}}@media screen and (max-width:700px){header{padding:0 .5em}}header a{color:var(--dark-text-primary);text-decoration:none;font-weight:600;letter-spacing:.5px;transition:color .2s}header a:hover{color:var(--primary-red-light)}header h1{font-family:BR,THICCCBOI-Regular,sans-serif;text-transform:lowercase;font-weight:800;font-size:2.1rem;background:linear-gradient(135deg,var(--primary-red),var(--primary-red-light) 80%);-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:2px;margin:0;text-shadow:0 2px 8px rgba(239,68,68,.15);transition:color .2s}footer{width:100%;border-top:none;border-radius:0;height:var(--footer-height);background:rgba(15,23,42,.55);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:none;color:var(--dark-text-primary);position:relative;overflow:hidden;padding:0}footer:hover:before{opacity:.7}footer .footer-content{display:flex;justify-content:center;align-items:center;flex-direction:row;gap:3rem;max-width:1200px;margin:0 auto;padding:2.5rem 1.5rem;width:100%;text-align:center}@media screen and (max-width:900px){footer .footer-content{gap:2rem;padding:2rem 0}}@media screen and (max-width:700px){footer{height:auto}footer .footer-content{flex-direction:column;padding:2rem 0}}footer .footer-content div{display:flex;justify-content:flex-start;flex-direction:column;flex:1 1;min-width:0;max-width:520px;margin:0;z-index:1;align-items:center}footer .footer-content div h3{font-size:1.5rem;color:var(--dark-text-primary);text-shadow:0 2px 8px rgba(239,68,68,.15);margin-bottom:.8rem;font-weight:800;letter-spacing:1px;background:linear-gradient(135deg,var(--primary-red),var(--primary-red-light) 80%);-webkit-background-clip:text;background-clip:text;color:transparent;animation:fadeIn 1s ease-in-out}footer .footer-content div p{font-size:1rem;color:var(--dark-text-secondary);line-height:1.7;margin:0;opacity:.92;transition:opacity .3s ease;font-weight:500;letter-spacing:.01em}footer .footer-content div p:hover{opacity:1}footer .footer-content div ul{list-style-type:none;padding:0;margin:0}footer .footer-content div ul li{font-size:.95rem;color:var(--dark-text-primary);margin:.6em 0;transition:color .3s,transform .3s,background .3s;font-weight:500;border-left:3px solid transparent;padding-left:.75em;border-radius:.5em}footer .footer-content div ul li:hover{color:var(--primary-red-light);border-left:3px solid var(--primary-red);background:rgba(239,68,68,.08);transform:translateX(8px) scale(1.03)}footer .footer-content div ul li a{color:inherit;text-decoration:none;transition:color .3s}footer .footer-content div ul li a:hover{color:var(--primary-red-light)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}