.danki-return{position:fixed;right:20px;top:24px;z-index:20;display:inline-flex;align-items:center;justify-content:center;height:30px;padding:0 12px;border:1px solid #46515d;border-radius:5px;background:#1b2026f7;color:#edf0f2;text-decoration:none;font:600 11px Arial,Helvetica,sans-serif;letter-spacing:1px}.danki-return:focus-visible{outline:2px solid white;outline-offset:3px}.auth-gate{height:100dvh;background:#17212a var(--daily-background,none) center/cover;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px}.auth-gate[hidden]{display:none}.auth-gate p{max-width:90%;text-align:center;padding:10px;border-radius:5px;background:#1b2026f7;color:#edf0f2;font:14px Arial,Helvetica,sans-serif}.auth-gate button{border:1px solid #46515d;border-radius:5px;background:#1b2026f7;padding:12px 18px;color:#edf0f2;cursor:pointer;font:600 14px Arial,Helvetica,sans-serif}@media(max-width:480px){.danki-return{right:12px;top:24px;height:27px;padding:0 7px;font-size:10px}.header{padding-right:77px}.brand{gap:7px}.brand h1{font-size:13px;letter-spacing:1px}.brand .current-time{font-size:11px}}

.brand{color:#fff;text-shadow:0 1px 3px #000,0 0 8px #0008}

/* Square corners on every Temponote box and control. */
.app *,.eternal-area *,.danki-return,.auth-gate *{border-radius:0!important}

.note .note-body{cursor:pointer}.note .note-body:focus-visible{outline:2px solid #b0baff;outline-offset:3px}.note.selected{background:#292e56;border-color:#b0baff;box-shadow:inset 4px 0 #b0baff}.note.selected .delete{background:#292e56}

.eternal-area{position:fixed;right:20px;bottom:max(14px,env(safe-area-inset-bottom));z-index:25}#eternal-toggle{height:30px;padding:0 10px;border:1px solid #53606c;border-radius:5px;background:#1b2026f7;color:#edf0f2;font-size:10px;font-weight:600;letter-spacing:.5px}#eternal-panel{position:absolute;right:0;bottom:40px;width:min(360px,calc(100vw - 32px));max-height:calc(100dvh - 115px);overflow:auto;background:#1b2026fa;border:1px solid #53606c;border-radius:8px;box-shadow:0 8px 28px #0006;padding:12px;color:#edf0f2}#eternal-panel header{display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:1px;margin-bottom:10px}.eternal-close{font-size:22px;line-height:1;padding:0 3px}#eternal-panel form{border:1px solid #46515d;border-radius:6px;padding:10px}#eternal-panel textarea{font-size:14px;min-height:54px}.eternal-days{display:flex;gap:4px;margin-top:8px}.eternal-days button{flex:1;min-width:0;height:27px;border:1px solid #53606c;border-radius:4px;background:#252d35;font-size:9px;color:#edf0f2}.eternal-days button[aria-pressed=true]{background:#edf0f2;color:#17212a;border-color:#edf0f2}.eternal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:10px}.eternal-actions button,.eternal-row button{border:1px solid #53606c;border-radius:4px;background:#252d35;color:#edf0f2;padding:4px 9px;font-size:11px}.eternal-row{position:relative;border-bottom:1px solid #46515d;padding:0 0 10px;margin-bottom:10px}.eternal-row p{font-size:14px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}.eternal-row small{display:block;font-size:9px;color:#acb6c0;margin-top:5px}.eternal-row>div{display:flex;justify-content:flex-end;gap:6px;margin-top:5px}.note.eternal .delete{margin-left:auto}@media(max-width:820px){.eternal-area{right:16px}.composer{padding-bottom:max(58px,calc(45px + env(safe-area-inset-bottom)))}}

/* Opaque black-indigo controls and bold text throughout Temponote. */
.app,.app *,.eternal-area,.eternal-area *,.danki-return,.auth-gate,.auth-gate *{font-weight:700!important}.note,.composer form,#eternal-panel,.auth-gate p{background:#111225;border-color:#383b60}.time-buttons button,.note-time-buttons button,.send,.reset,.eternal-days button,.eternal-actions button,.eternal-row button,#eternal-toggle,.danki-return,.auth-gate button,.eternal-close{background:#1c1e3b;border-color:#40446c}.delete{background:#111225}.time-buttons button:hover,.note-time-buttons button:hover,.send:hover,.eternal-actions button:hover,.eternal-row button:hover{background:#303456}.eternal-days button[aria-pressed=true]{background:#454d85;color:#fff;border-color:#8a94cd}.app button:disabled,.eternal-area button:disabled,.auth-gate button:disabled{opacity:1;color:#9095b8}.note .expiry{font-size:12px}.error{background:#3b182d}

/* Graphite two-section cards: compact footer and full purple pin border. */
.note{display:block;padding:0;gap:0;background:#242529;border:1px solid #606169;box-shadow:none;color:#f4f4f5;overflow:hidden}
.note-heading{display:flex;align-items:flex-start;gap:12px;padding:13px 16px;min-height:48px}
.note .number{font-size:18px;line-height:1.45;padding-top:0;min-width:24px;color:#bfc0c7}
.note .note-body p{font-size:14px;line-height:1.65;color:#f4f4f5}
.note .note-body:focus-visible{outline:2px solid #b58aff;outline-offset:3px}
.note-pin{display:none;color:#b58aff;align-items:center;min-height:26px}
.note.selected .note-pin{display:flex}
.note-footer{display:flex;align-items:center;gap:7px;min-height:32px;padding:4px 10px 4px 16px;background:#1e1f23;border-top:1px solid #56575e}
.note .expiry{margin:0;font-size:12px;line-height:20px;color:#d1d1d8;white-space:nowrap}
.note .note-time-buttons{flex-direction:row;gap:5px;margin-left:auto}
.note .note-time-buttons[hidden]{display:none}
.note .note-time-buttons button{width:auto;min-width:39px;height:23px;padding:0 7px;line-height:21px;background:#303136;border:1px solid #696a73;color:#f4f4f5;font-size:10px}
.note .delete,.note.selected .delete{display:flex;align-items:center;justify-content:center;width:25px;height:23px;padding:2px;background:#303136;border:1px solid #696a73;color:#d5d5dc;flex-shrink:0}
.note .note-time-buttons button:hover,.note .delete:hover{background:#42434b;color:#fff}
.note.selected{background:#2d2e33;border-color:#b58aff;box-shadow:inset 0 0 0 1px #b58aff}
.note.selected .note-footer{background:#27282d}
.note.selected .expiry{color:#b58aff}
.note.eternal .delete{margin-left:auto}
.note.urgent .note-body p{color:#ff8585}
.note.selected .number{color:#d8c4f5}
@media(max-width:480px){.note-heading{padding:11px 12px;gap:9px;min-height:44px}.note .number{font-size:18px;min-width:21px}.note-footer{padding:4px 8px 4px 12px;gap:5px}.note .note-time-buttons{gap:4px}.note .note-time-buttons button{min-width:34px;padding:0 5px;font-size:9px}.note .expiry{font-size:11px}.note .note-body p{font-size:14px}}

.composer form,#eternal-panel,.auth-gate p{background:#242529;border-color:#606169}.time-buttons button,.send,.reset,.eternal-days button,.eternal-actions button,.eternal-row button,#eternal-toggle,.danki-return,.auth-gate button,.eternal-close{background:#303136;border-color:#696a73}.time-buttons button:hover,.send:hover,.eternal-actions button:hover,.eternal-row button:hover{background:#42434b}.eternal-days button[aria-pressed=true]{background:#494052;border-color:#b58aff;color:#fff}

/* Keep pin selection stable without moving the text or clipping its border. */
.notes-area{overflow-anchor:none;scroll-behavior:auto}.note{position:relative}.note-pin{display:flex;flex:0 0 15px;visibility:hidden}.note.selected .note-pin{visibility:visible}.note.selected{box-shadow:none;border-color:#b58aff}.note.selected::after{content:"";position:absolute;inset:0;border:1px solid #b58aff;pointer-events:none;z-index:2}.note-heading{cursor:pointer}.note .expiry{text-transform:uppercase}

.note.eternal .delete{margin-left:0}

/* Notes on the left, independent daily timers on the right. */
.temponote-workspace{display:grid;grid-template-columns:minmax(0,1fr) 536px;min-height:100dvh;background:var(--daily-background,none) center/cover fixed no-repeat}
.temponote-workspace .app{background:none;min-width:0;width:min(100%,808px);height:100dvh}
.temponote-workspace .header{padding:0 24px}
.temponote-workspace .notes-wrap,.temponote-workspace .composer-wrap{max-width:none;margin:0}
.temponote-workspace .notes-wrap{padding:16px 24px 24px}
.temponote-workspace .composer{padding:16px 24px max(20px,env(safe-area-inset-bottom))}
.composer-top{position:relative;padding-right:145px;min-height:78px}
.composer-top .eternal-area{position:absolute;right:0;bottom:13px;z-index:25}
.composer-top #eternal-panel{bottom:40px;max-height:calc(100dvh - 190px)}
.composer #eternal-panel form{display:block;box-shadow:none}
.timebox-side{min-width:0;height:100dvh;overflow:auto;padding:80px 20px 70px 12px;color:#f4f4f5;font:700 12px Arial,Helvetica,sans-serif;scrollbar-width:thin}
.timebox-side *{box-sizing:border-box;border-radius:0;font-weight:700}
.timebox-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;max-width:676px;text-shadow:0 1px 4px #000}
.timebox-header h2{font-size:16px;letter-spacing:2px}
.timebox-side button{color:#f4f4f5;background:#303136;border:1px solid #696a73;padding:7px 10px;cursor:pointer}
.timebox-side button:focus-visible,.timebox-side input:focus-visible{outline:2px solid #b58aff;outline-offset:3px}
.timebox-side button:disabled{opacity:.55;cursor:default}
.timebox-header .timebox-add{width:32px;height:32px;font-size:23px;line-height:18px;padding:0;background:#242529}
.timebox-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));justify-content:end;gap:12px;align-items:start;max-width:504px;margin-left:auto}
.timebox-card{position:relative;aspect-ratio:1;min-width:0;border:2px solid var(--box-color);background:var(--box-color);color:var(--box-text)}
.timebox-card.running{border-color:#050607;background:#050607;box-shadow:none}
.timebox-card .timebox-run{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;width:100%;height:100%;background:var(--box-color);color:var(--box-text);border:0;padding:30px 10px 12px;text-align:center}
.timebox-name{text-transform:uppercase;font-size:14px;line-height:1.3;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.timebox-run time{font-size:20px;font-variant-numeric:tabular-nums;white-space:nowrap}
.timebox-state{font-size:12px;line-height:1}
.timebox-card .timebox-edit{position:absolute;right:3px;top:3px;padding:0 4px;min-width:27px;height:23px;font-size:20px;line-height:15px;color:var(--box-text);border:0;background:var(--box-color)}
.timebox-card .timebox-move{position:absolute;left:3px;top:3px;padding:0;width:27px;height:23px;font-size:20px;line-height:20px;color:var(--box-text);border:0;background:var(--box-color);z-index:1;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.timebox-card.dragging{opacity:.65;outline:2px solid #b58aff;outline-offset:2px}.timebox-card.dragging .timebox-move{cursor:grabbing}
.timebox-editor{max-width:676px;display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:12px;margin-bottom:16px;background:#242529;border:1px solid #696a73}
.timebox-editor input:not([type=color]){min-width:120px;width:100%;padding:9px 10px;border:1px solid #696a73;background:#1e1f23;color:white;text-transform:uppercase;font-size:13px}
.timebox-color-label{display:flex;align-items:center;gap:9px;font-size:10px}
.timebox-editor input[type=color]{width:33px;height:28px;padding:0;border:1px solid #696a73;background:#1e1f23;cursor:pointer}
.timebox-editor-actions{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:6px;flex:1}
.timebox-editor-actions button{font-size:10px}
.timebox-adjust{width:100%;padding-top:10px;border-top:1px solid #696a73;display:grid;grid-template-columns:auto 90px;align-items:center;gap:8px;font-size:10px}
.timebox-adjust-total{grid-column:1/-1;display:flex;justify-content:space-between;font-variant-numeric:tabular-nums}
.timebox-adjust>div:last-child{grid-column:1/-1;display:flex;gap:7px}
.timebox-adjust>div:last-child button{flex:1;font-size:10px}
.timebox-editor #timebox-minutes{width:90px;min-width:0;text-align:center}
.timebox-error{max-width:676px;padding:10px;background:#482b2c;color:#ffcbc4;margin-bottom:12px;font-size:11px}
.timebox-chart-area{position:fixed;right:20px;bottom:max(14px,env(safe-area-inset-bottom));z-index:26}
#timebox-chart-toggle{height:30px;padding:0 10px;font-size:10px;letter-spacing:.5px;background:#303136}
#timebox-chart{position:absolute;bottom:40px;right:0;width:min(540px,calc(100vw - 32px));max-height:calc(100dvh - 100px);overflow:auto;padding:16px;background:#242529;border:1px solid #696a73;box-shadow:0 8px 28px #0006}
#timebox-chart header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
#timebox-chart header [role=group]{display:flex;gap:6px}
#timebox-chart [data-period]{font-size:10px}
#timebox-chart [aria-pressed=true]{border-color:#b58aff;background:#494052}
#timebox-chart .timebox-chart-close{border:0;font-size:24px;line-height:20px;padding:0 4px;background:transparent}
.timebox-chart-caption{font-size:10px;color:#d1d1d8;letter-spacing:1px;margin-bottom:10px}
.timebox-chart-axis{display:flex;justify-content:space-between;margin:0 72px 10px 120px;font-size:9px;color:#c4c4cb;font-variant-numeric:tabular-nums;gap:8px}
.timebox-chart-row{display:grid;grid-template-columns:110px minmax(0,1fr) 66px;align-items:center;gap:10px;min-height:38px;font-size:11px}
.timebox-chart-row>span:first-child{text-transform:uppercase;overflow-wrap:anywhere}
.timebox-chart-row>span:last-child{text-align:right;font-variant-numeric:tabular-nums}
.timebox-chart-track{height:18px;background:#1e1f23}
.timebox-chart-bar{height:100%;min-width:0}
/* A quiet stone finish over an opaque base; no transparency through the cards. */
.temponote-workspace{--stone-finish:radial-gradient(ellipse 170% 95% at -12% -35%,transparent 62%,#ffffff0c 63%,#00000012 64%,transparent 65.5%),radial-gradient(ellipse 180% 110% at 115% 130%,transparent 55%,#ffffff09 56%,transparent 57%,#00000012 58%,transparent 60%),linear-gradient(122deg,transparent 29%,#ffffff06 30%,transparent 31.5% 69%,#00000012 70%,#ffffff08 71%,transparent 72.5%),linear-gradient(145deg,#ffffff08,#00000012)}
.note,.note.selected,.note-footer,.note.selected .note-footer,.composer-wrap>form,.timebox-card .timebox-run{background-image:var(--stone-finish)}
.note,.note.selected,.composer-wrap>form{background-image:linear-gradient(#0c0f1666,#0c0f1666),url('./note-sparkles-black-v3.jpg');background-size:cover;background-position:center 55%}
.note-footer,.note.selected .note-footer{background-image:none}
.timebox-card.running .timebox-run,.timebox-card.running .timebox-move,.timebox-card.running .timebox-edit{background:#050607;color:#fff;background-image:none}
.timebox-card:not(.running) .timebox-run{background-color:#080a0e;background-image:linear-gradient(#0005,#0005),url('./note-sparkles-black-v3.jpg');background-size:cover;background-position:center 55%;color:#fff}
.timebox-card .timebox-move,.timebox-card .timebox-edit{background:#080a0e;color:#fff}
@media(min-width:761px) and (max-width:1000px){.temponote-workspace{grid-template-columns:minmax(0,1fr)}.temponote-workspace .app{height:75dvh;min-height:460px;width:100%}.timebox-side{width:min(100%,536px);margin-left:auto;height:auto;min-height:25dvh;padding-top:20px}}
@media(max-width:760px){.timebox-card .timebox-run{gap:6px;padding:24px 6px 7px}.timebox-name{font-size:11px;-webkit-line-clamp:2}.timebox-run time{font-size:clamp(12px,4vw,16px)}.timebox-state{font-size:10px}}
@media(max-width:760px){.temponote-workspace{grid-template-columns:minmax(0,1fr)}.temponote-workspace .app{height:75dvh;min-height:460px;width:100%}.timebox-side{width:min(100%,536px);margin-left:auto;height:auto;min-height:25dvh;padding:20px 16px 70px}.timebox-header{max-width:none}.temponote-workspace .header{height:70px;padding:0 16px}.temponote-workspace .notes-wrap{padding:10px 16px 16px}.temponote-workspace .composer{padding:12px 16px 16px}.composer-top{padding-right:130px}.composer-top #eternal-toggle{font-size:9px;padding:0 7px}.timebox-chart-area{right:16px}.timebox-chart-row{grid-template-columns:80px minmax(0,1fr) 61px;gap:7px;font-size:10px}.timebox-chart-axis{margin-left:87px;margin-right:68px}}

.composer-top{padding-right:0}.note-tools{position:absolute;right:0;bottom:13px;display:flex;align-items:center;gap:6px;z-index:25}
.composer-top .note-tools .eternal-area{position:relative;right:auto;bottom:auto}.locked-area{position:relative}
#locked-toggle{height:30px;padding:0 10px;background:#303136;border:1px solid #696a73;color:#edf0f2;font-size:10px;letter-spacing:.5px}
#locked-panel{position:absolute;right:0;bottom:40px;width:min(700px,calc(100vw - 32px));max-height:calc(100dvh - 150px);overflow:auto;padding:14px;background:#242529;border:1px solid #696a73;box-shadow:0 8px 28px #0006;color:#f4f4f5;text-align:left}
#locked-panel header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;font-size:11px;letter-spacing:1px}
#locked-panel button{border:1px solid #696a73;background:#303136;color:white;padding:6px 10px;font-size:10px}
#locked-panel .locked-close{border:0;background:transparent;padding:0 3px;font-size:24px;line-height:20px}
.composer #locked-panel form{display:flex;flex-wrap:wrap;gap:8px;align-items:center;box-shadow:none;border:0;padding:0;background:none}
#locked-panel input{font:700 13px Arial,Helvetica,sans-serif;min-width:0;flex:1;padding:9px 10px;background:#1e1f23;color:#fff;border:1px solid #696a73;border-radius:0}
.locked-tabs-row{display:flex;align-items:center;gap:7px;margin-bottom:8px}.locked-tabs{display:flex;overflow-x:auto;gap:5px;flex:1;scrollbar-width:thin}
#locked-panel .locked-tabs button{min-width:32px;font-size:11px;flex-shrink:0}.locked-tabs [aria-selected=true]{border-color:#b58aff!important;background:#494052!important}
#locked-panel .locked-add{width:32px;height:30px;font-size:20px;line-height:16px;padding:0;flex-shrink:0}
#locked-text{display:block;resize:vertical;width:100%;height:320px;min-height:180px;max-height:55dvh;padding:12px;background:#141519;border:1px solid #606169;color:#fff;font:700 14px/1.6 Arial,Helvetica,sans-serif;letter-spacing:0;overflow:auto}
#locked-panel .locked-password-toggle{margin-top:10px}.composer #locked-panel .locked-change-form{margin-top:10px}
.locked-status{font-size:10px;line-height:1.4;min-height:14px;margin:9px 0 0;color:#d5d5dc;letter-spacing:.3px}
@media(max-width:760px){#locked-toggle{padding:0 7px;font-size:9px}.composer-top{padding-right:0}#locked-panel{padding:12px;max-height:max(200px,calc(75dvh - 180px))}#locked-panel input{flex-basis:150px}#locked-text{height:300px;max-height:45dvh}}

/* Solid, raised task buttons. The task label itself sits at the square's centre. */
.timebox-grid{gap:18px 12px;padding-bottom:8px}
.timebox-card,.timebox-card.running{border:3px solid #141417;background:var(--box-color);color:var(--box-text);box-shadow:0 7px 0 #141417,0 10px 8px #0005;transition:transform .1s ease,box-shadow .1s ease}
.timebox-card .timebox-run,.timebox-card:not(.running) .timebox-run,.timebox-card.running .timebox-run{position:relative;display:block;background:var(--box-color);background-image:none;color:var(--box-text);padding:0;box-shadow:inset 0 3px 0 #ffffff40,inset 0 -3px 0 #0003}
.timebox-card .timebox-name{position:absolute;left:8px;right:8px;top:50%;transform:translateY(-50%);font-size:21px;line-height:1.15;-webkit-line-clamp:3;text-align:center}
.timebox-card .timebox-run time{position:absolute;left:4px;right:4px;bottom:19px;font-size:16px;line-height:1;opacity:.9}
.timebox-card .timebox-state{position:absolute;bottom:5px;left:0;right:0;font-size:9px}
.timebox-card .timebox-move,.timebox-card .timebox-edit,.timebox-card.running .timebox-move,.timebox-card.running .timebox-edit{background:var(--box-color);color:var(--box-text)}
.timebox-card.running,.timebox-card:has(.timebox-run:active){transform:translateY(6px);box-shadow:0 1px 0 #141417,0 2px 3px #0005}
.timebox-card.running .timebox-run{box-shadow:inset 0 3px 0 #0003,inset 0 -1px 0 #ffffff20}
.timebox-card.dragging{outline:2px dashed #eee;outline-offset:3px}
.timebox-side button:focus-visible{outline:2px solid #fff;outline-offset:3px}
#locked-text{white-space:pre-wrap;overflow-wrap:break-word;overflow-y:scroll;scrollbar-width:auto;overscroll-behavior:contain;height:420px;max-height:55dvh}
@media(max-width:760px){.timebox-card .timebox-name{font-size:16px;left:5px;right:5px;-webkit-line-clamp:3}.timebox-card .timebox-run time{font-size:13px;bottom:16px}.timebox-card .timebox-state{bottom:4px;font-size:8px}#locked-text{height:360px;max-height:45dvh}}
