@import "https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";:root{--bg:#1e1e1e;--oberfläche:#282828;--oberfläche-border:#3a3a3a;--text:#fff;--text-grau:#a8a8a8;--rot:#d22d54;--dunkelrot:#b0234a;--blau:#4499b5;--dunkelblau:#113141}*{box-sizing:border-box}body{background-color:var(--bg);color:var(--text);min-height:100vh;margin:0;padding:0}.site-header{background-color:var(--bg);z-index:1000;width:100%;height:65px;position:fixed}.site-header-inner{align-items:center;max-width:1120px;height:100%;margin:0 auto;padding:0 16px;display:flex}.site-logo{align-items:center;display:inline-flex}.site-logo img{width:190px;height:auto;display:block}.site-header:after{content:"";background:linear-gradient(to right, var(--rot) 0 25%, var(--dunkelblau) 25% 100%);height:4px;position:absolute;bottom:-4px;left:0;right:0}.container{flex-direction:column;align-items:center;width:100%;padding:0 16px 48px;font-family:Poppins,sans-serif;display:flex}.header{text-align:center;margin-top:300px;margin-bottom:24px;font-size:clamp(36px,8vw,80px);font-weight:400}.header p{margin:0;display:inline-block;position:relative}.header p:after{content:"";background-color:var(--rot);width:.04em;height:.85em;animation:1.2s step-end infinite blink-cursor;position:absolute;top:12%;right:-.12em}@keyframes blink-cursor{0%,to{opacity:1}50%{opacity:0}}.input{width:100%;max-width:450px;display:inline-block;position:relative}.input input{background-color:var(--oberfläche);border:1px solid var(--oberfläche-border);width:100%;height:44px;color:var(--text);border-radius:22px;padding-left:18px;padding-right:120px;font-family:inherit;font-size:16px}.input input::placeholder{color:var(--text-grau)}.input input:focus{border-color:var(--blau);outline:none}.input button{cursor:pointer;background-color:var(--rot);height:100%;color:var(--text);border:none;border-top-right-radius:22px;border-bottom-right-radius:22px;padding:0 20px;font-family:inherit;font-weight:500;transition:background-color .2s;position:absolute;top:0;right:0}.input button:hover{background-color:var(--dunkelrot)}.datetime p{color:var(--blau);text-align:center;margin:16px 0 0;font-weight:300}.todos{width:100%;max-width:450px}.todos img:hover{cursor:pointer}.todos ul{width:100%;margin-top:20px;padding:0}.todos li.todo-item{align-items:center;gap:12px;width:100%;margin-bottom:10px;list-style-type:none;display:flex}.todo-checkbox{cursor:pointer;-webkit-tap-highlight-color:transparent;flex-shrink:0;width:24px;height:24px}.todo-card{background-color:var(--oberfläche);border:1px solid var(--oberfläche-border);border-radius:20px;flex-grow:1;justify-content:space-between;align-items:center;min-width:0;padding:12px 16px;display:flex}.todo-card span{word-break:break-word;flex-grow:1;margin-right:12px}.todo-card img{cursor:pointer;flex-shrink:0;width:24px;height:24px}@media screen and (width<=768px){.site-header{height:58px}.site-logo img{width:165px}}@media screen and (width<=480px){body{overflow-x:hidden}.header{margin-top:150px}.todos{margin-top:20px}.site-header{height:52px}.site-header-inner{padding:0 12px}.site-logo img{width:140px}.container{padding:0 12px 32px}.header{margin-bottom:16px}.input input{border-radius:24px;height:48px}.input button{border-top-right-radius:24px;border-bottom-right-radius:24px}.todos li.todo-item{gap:10px;margin-bottom:12px}.todo-card{min-height:48px;padding:14px 16px}}.modal-overlay{z-index:1000;background-color:#000000b3;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal-content{background-color:var(--oberfläche);border:1px solid var(--oberfläche-border);text-align:center;border-radius:20px;width:100%;max-width:400px;padding:24px;animation:.2s ease-out modalFadeIn;box-shadow:0 10px 25px #00000080}.modal-content h3{color:var(--text);margin-top:0;font-size:20px}.modal-content p{color:var(--text-grau);margin-bottom:24px;font-size:14px}.modal-actions{justify-content:center;gap:12px;display:flex}.modal-actions button{cursor:pointer;border:none;border-radius:12px;flex:1;padding:12px 16px;font-family:inherit;font-size:14px;font-weight:500;transition:opacity .2s}.modal-actions button:hover{opacity:.85}.btn-cancel{background-color:var(--oberfläche-border);color:var(--text)}.btn-confirm{background-color:var(--rot);color:var(--text)}
