:root{--bg:#f7f8fa;--panel:#fff;--text:#252e3b;--muted:#87909c;--border:#e8ebef;--accent:#467667;--soft:#edf4f0}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px -apple-system,BlinkMacSystemFont,'Segoe UI','Malgun Gothic',sans-serif}body.dark{--bg:#171e23;--panel:#212a30;--text:#e6eceb;--muted:#a0aeaf;--border:#354046;--accent:#88c6ab;--soft:#2c4038}button,input,select,textarea{font:inherit;color:inherit}button,a,input,textarea,select{outline-offset:4px}button{cursor:pointer;border:0;background:transparent}aside{position:fixed;width:230px;height:100vh;background:var(--panel);border-right:1px solid var(--border);padding:38px 24px;display:flex;flex-direction:column}.brand{text-decoration:none;color:var(--text);font-size:22px;font-weight:650;display:flex;align-items:center;gap:10px;letter-spacing:-1px}.logo{background:var(--accent);color:white;width:38px;height:38px;display:grid;place-items:center;border-radius:12px;font-size:27px;font-family:Georgia}.dot{font-size:7px;color:var(--accent);margin-left:10px}.navlabel{font-size:10px;letter-spacing:2px;color:var(--muted);margin:50px 12px 16px}nav button{width:100%;text-align:left;padding:13px 14px;border-radius:8px;margin-bottom:6px;color:var(--muted)}nav button.active{background:var(--soft);color:var(--accent);font-weight:650}nav b{float:right;font-size:11px;font-weight:400}.asidebottom{margin-top:auto}.asidebottom button{display:block;font-size:12px;color:var(--muted);padding:10px}.asidebottom small{display:block;border-top:1px solid var(--border);margin-top:22px;padding:25px 10px 0;color:var(--muted);font-size:11px;line-height:1.9}main{margin-left:230px;padding:0 46px;max-width:1640px}header{height:88px;display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:1px;color:var(--muted);border-bottom:1px solid var(--border)}.slash{margin:0 13px;color:#c8ced3}.status{letter-spacing:0;font-size:11px}.status i{display:inline-block;width:6px;height:6px;background:#7faa8a;border-radius:50%;margin-right:7px}.hero{display:flex;justify-content:space-between;align-items:center;padding:40px 0 30px}.eyebrow{font-size:11px;color:var(--accent);letter-spacing:1px}h1{font-size:32px;letter-spacing:-1.5px;font-weight:650;margin:12px 0}h1 span{color:var(--accent)}.hero p,.sectiontop p{color:var(--muted);font-size:12px}.clock{font-size:36px;font-weight:300;letter-spacing:-2px;font-variant-numeric:tabular-nums}.searchbar{display:flex;gap:14px;align-items:center;background:var(--panel);padding:13px 18px;border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 12px #00000002}.searchbar>span{font-size:28px;color:var(--accent)}input,textarea,select{background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:10px}.searchbar input{flex:1;border:0;min-width:0}.searchbar select{border:0;font-size:11px}.searchbar button{font-size:11px;color:var(--accent);white-space:nowrap}kbd{font:10px monospace;border:1px solid var(--border);border-radius:4px;padding:3px 6px;color:var(--muted)}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:30px;margin-top:36px}.sectiontop{display:flex;align-items:center;justify-content:space-between}h2{font-size:16px;margin:0;font-weight:650;letter-spacing:-.4px}h2 #count,h2>span{color:var(--muted);font-size:11px;margin-left:8px;font-weight:400}.primary{background:var(--accent);color:var(--panel);border-radius:7px;padding:11px 15px;font-size:12px;white-space:nowrap}#filters{display:flex;gap:7px;flex-wrap:wrap;margin:22px 0 20px}#filters button{font-size:11px;padding:7px 11px;border-radius:6px;color:var(--muted)}#filters button.active{background:var(--text);color:var(--panel)}#cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.card{position:relative;background:var(--panel);border:1px solid var(--border);border-radius:11px;transition:transform .18s,border-color .18s;min-width:0}.card:hover{transform:translateY(-3px);border-color:#91b3a5}.card a{display:block;text-decoration:none;color:var(--text);padding:20px 17px 17px}.icon{width:35px;height:35px;border-radius:10px;background:var(--soft);color:var(--accent);display:grid;place-items:center;font-size:15px;font-weight:bold;margin-bottom:19px}.card:nth-child(3n+2) .icon{background:#eff0f9;color:#7d7daa}.card:nth-child(3n) .icon{background:#fbf2e6;color:#b79458}.card strong{display:block;font-size:13px;margin-bottom:7px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.card small{display:block;color:var(--muted);font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card .star{position:absolute;right:10px;top:12px;color:#c9cfd3;font-size:16px}.card .star.on{color:#b79b64}.card .edit{position:absolute;right:9px;bottom:12px;color:var(--muted);font-size:17px}.card small{padding-right:17px}.recent{margin-top:32px}.recent h2{font-size:13px}.recent h2 span{font-size:9px;letter-spacing:1px;margin-left:10px}#recent{margin-top:14px;display:flex;gap:8px;flex-wrap:wrap}#recent a{font-size:11px;color:var(--muted);text-decoration:none;padding:8px 11px;border:1px solid var(--border);border-radius:6px}#recent p,.empty{font-size:12px;color:var(--muted);padding:15px 0}.empty{grid-column:1/-1}.footnote{font-size:10px;color:var(--muted);margin:30px 0}.widget{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:20px;margin-bottom:17px}.widgettitle{display:flex;justify-content:space-between;align-items:center}.widgettitle h2{font-size:13px}.widgettitle span{font-size:11px;color:var(--muted)}.note{background:#f6f3e9;border-color:#ece8da;color:#575648}.dark .note{background:#35362b;border-color:#454638;color:#e7e4cf}.note textarea{width:100%;height:160px;resize:vertical;border:0;background:transparent;font-size:12px;line-height:1.9;padding:18px 0 0}.note small{font-size:9px;color:#a19e8c}.todo form{display:flex;gap:5px;margin:18px 0 10px}.todo input{width:100%;font-size:11px;border:0;background:var(--bg)}.todo form button{color:var(--accent);font-size:20px}.task{display:flex;gap:9px;align-items:center;padding:10px 0;border-bottom:1px solid var(--border);font-size:12px}.task input{width:14px;accent-color:var(--accent)}.task span{flex:1;overflow-wrap:anywhere}.task.done span{text-decoration:line-through;color:var(--muted)}.task button{color:var(--muted)}.quiet{padding:22px 8px;color:var(--muted)}.quiet>span{font-size:8px;letter-spacing:1.8px}.quiet p{font-size:19px;line-height:1.7;letter-spacing:-.7px;color:var(--accent)}.lines{font-size:48px;line-height:20px;letter-spacing:8px;opacity:.35}footer{border-top:1px solid var(--border);padding:23px 0;margin-top:25px;color:var(--muted);font-size:9px;letter-spacing:1.6px}footer span{float:right;letter-spacing:0}dialog{width:420px;max-width:94vw;border:1px solid var(--border);border-radius:15px;padding:25px;background:var(--panel);color:var(--text)}dialog::backdrop{background:#172c2a60;backdrop-filter:blur(3px)}dialog label{display:block;font-size:12px;margin-top:18px}dialog label input:not([type=checkbox]){display:block;width:100%;margin-top:7px}.check{display:flex;align-items:center;gap:8px}.dialogactions{display:flex;justify-content:space-between;margin-top:24px}#delete{color:#b96464}#error{font-size:12px;color:#b96464}#toast{position:fixed;bottom:25px;left:50%;background:var(--text);color:var(--panel);border-radius:8px;padding:12px 20px;display:none;font-size:12px;z-index:5}@media(min-width:1450px){#cards{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:1100px){aside{width:190px;padding:30px 16px}main{margin-left:190px;padding:0 28px}.workspace{grid-template-columns:minmax(0,1fr) 240px;gap:20px}#cards{grid-template-columns:repeat(2,minmax(0,1fr))}h1{font-size:27px}}@media(max-width:800px){aside{position:static;width:auto;height:auto;padding:18px 20px;border-right:0;border-bottom:1px solid var(--border)}.brand{font-size:19px}.navlabel,.asidebottom small{display:none}nav{display:flex;overflow:auto;margin-top:18px}nav button{white-space:nowrap;width:auto;margin-right:5px}nav b{display:none}.asidebottom{display:flex;flex-wrap:wrap}.asidebottom button{font-size:10px}main{margin:0;padding:0 20px}header{height:56px}.workspace{grid-template-columns:1fr}.widgets{display:grid;grid-template-columns:1fr 1fr;gap:15px}.quiet{display:none}.hero{padding:28px 0}.clock{font-size:28px}h1{font-size:25px}.searchbar{gap:4px;padding:9px}.searchbar kbd{display:none}.searchbar select{max-width:80px}.status{font-size:9px}.widget{margin:0}#cards{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:520px){#cards{grid-template-columns:repeat(2,minmax(0,1fr))}.widgets{grid-template-columns:1fr}.clock{font-size:23px}.hero p{font-size:10px}h1{font-size:22px}.searchbar button{font-size:10px}.status{display:none}.primary{font-size:11px;padding:10px}.card a{padding:17px 14px}.card strong{font-size:12px}}

.headeractions{display:flex;align-items:center;gap:16px}.loginbutton{border:1px solid var(--border);background:var(--panel);border-radius:7px;padding:9px 12px;font-size:11px;letter-spacing:0}.loginhelp{color:var(--muted);font-size:12px;line-height:1.8}#loginError{color:#b96464;font-size:12px}textarea[readonly],input[readonly]{cursor:pointer}.task input:disabled{opacity:.65}.status{cursor:pointer}button:disabled{opacity:.55;cursor:wait}[hidden]{display:none!important}

body:not(.authenticated) .card .star,body:not(.authenticated) .card .edit{display:none}.private-label{margin:0 0 16px;letter-spacing:1px}#privateGate p{margin:16px 0;line-height:1.8}

.workspace{display:block}.page-panel{max-width:900px}.page-panel .widget{margin-top:22px}.page-panel .note textarea{height:50vh;min-height:260px;padding:12px;font-size:14px}.page-panel .todo input{font-size:14px}.page-panel .task{font-size:14px;padding:16px 0}#saveError{color:#b96464;font-size:12px}#notestatus:empty{display:none}

.group-actions,.group-add,.group-row{display:flex;gap:8px;align-items:center}.group-row{margin:12px 0}.group-row input,.group-add input{min-width:0;flex:1}.group-row span{font-size:11px;color:var(--muted);white-space:nowrap}.group-row button{white-space:nowrap;font-size:12px}.group-add{margin-top:22px}#groupDialog{width:520px;max-height:85vh;overflow:auto}#groupError{color:#b96464;font-size:12px}@media(max-width:520px){.group-actions{gap:4px}.group-actions button{padding:9px 8px}}

.favorites-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px}.favorites-toolbar #filters{flex:1}.view-setting{display:flex;align-items:center;gap:8px;white-space:nowrap;font-size:12px;color:var(--muted)}.view-setting select{padding:7px 10px;color:var(--text)}
#cards[data-size="large"]{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}#cards[data-size="large"] .card a{padding:30px 24px 24px}#cards[data-size="large"] .icon{width:60px;height:60px;font-size:27px;border-radius:16px;margin-bottom:25px}#cards[data-size="large"] .card strong{font-size:17px}#cards[data-size="large"] .card small{font-size:12px}
#cards[data-size="small"]{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}#cards[data-size="small"] .card a{padding:14px 12px}#cards[data-size="small"] .icon{width:26px;height:26px;font-size:12px;border-radius:7px;margin-bottom:12px}#cards[data-size="small"] .card strong{font-size:12px;margin-bottom:5px}#cards[data-size="small"] .card small{font-size:9px}#cards[data-size="small"] .star{top:7px;right:5px;font-size:14px}#cards[data-size="small"] .edit{right:4px;bottom:7px}
@media(max-width:1250px){#cards[data-size="large"]{grid-template-columns:repeat(2,minmax(0,1fr))}#cards[data-size="small"]{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:800px){#cards[data-size="large"]{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.favorites-toolbar{align-items:flex-start;gap:6px;flex-wrap:wrap}.favorites-toolbar #filters{flex-basis:100%;margin-bottom:4px}.view-setting{margin:4px 0 16px auto}#cards[data-size="large"]{grid-template-columns:1fr}#cards[data-size="small"]{grid-template-columns:repeat(3,minmax(0,1fr))}#cards[data-size="large"] .card a{padding:24px}}

.group-row .group-move{border:1px solid var(--border);border-radius:5px;min-width:28px;min-height:30px;color:var(--accent)}.group-row .group-move:disabled{opacity:.3;cursor:default}@media(max-width:520px){.group-row{flex-wrap:wrap}.group-row input{flex-basis:65%}.group-row span{margin-right:auto}}

.group-row .group-drag{cursor:grab;touch-action:none;user-select:none;font-size:24px;color:var(--muted);min-width:32px;min-height:40px;padding:0}.group-row.dragging{background:var(--soft);outline:2px solid var(--accent);border-radius:8px}.group-row.dragging .group-drag{cursor:grabbing}.group-row{padding:4px 0}

.group-row .group-drag{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:0 0 46px;min-height:44px;border:1px solid var(--border);border-radius:7px;background:var(--soft);color:var(--accent)}.group-drag span{font-size:22px;line-height:20px;margin:0!important;color:inherit}.group-drag small{font-size:10px}.filter-grip{opacity:.65}#filters button[draggable="true"]{cursor:grab}#filters button.filter-dragging{opacity:.4}#filters button.drop-target{outline:2px solid var(--accent);outline-offset:2px}


/* Private file vault */
.file-page{width:100%;min-width:0}.file-title{gap:16px;flex-wrap:wrap}.file-title p{margin:10px 0 0;line-height:1.7}.file-private{font-size:10px!important;color:var(--accent)!important;background:var(--soft);padding:5px 9px;border-radius:20px;margin-left:9px}.file-quota{margin:22px 0 18px!important;padding:24px!important;border:1px solid var(--border);border-radius:12px;background:var(--panel)}.file-quota-head,.file-quota-foot,.file-upload-info,.file-progress-actions{display:flex;align-items:center;justify-content:space-between;gap:16px}.file-quota-head strong{font-size:14px}.file-quota-head span{font-size:13px;font-weight:600;color:var(--accent);font-variant-numeric:tabular-nums}.file-quota-foot{margin-top:11px;font-size:11px;color:var(--muted)}.file-meter{height:11px;overflow:hidden;background:var(--border);border-radius:12px;margin-top:18px}.file-meter>div{background:var(--accent);height:100%;width:0;transition:width .25s;border-radius:12px}.file-meter.warning>div{background:#c38a47}.file-meter.full>div{background:#c36060}.file-drop{width:100%;border:1.5px dashed #aac6b8;background:var(--soft);border-radius:12px;padding:31px 15px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;color:var(--text);transition:background .15s,border-color .15s}.file-drop-icon{color:var(--accent);font-size:32px;line-height:1}.file-drop strong{font-size:14px}.file-drop small{font-size:11px;color:var(--muted);line-height:1.65;text-align:center}.file-drop.dragging{border:2px solid var(--accent);background:var(--panel)}.file-drop:disabled{opacity:.55;cursor:not-allowed}.file-upload-progress{margin:15px 0 0!important;padding:17px!important;background:var(--panel);border:1px solid var(--border);border-radius:10px}.file-upload-info strong{max-width:75%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-upload-info span,.file-progress-actions{color:var(--muted);font-size:11px}.file-upload-progress .file-meter{margin-top:11px;height:8px}.file-progress-actions{margin-top:9px}.file-error{margin:12px 0;color:#b96464;font-size:12px}.file-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:30px 0 16px}.file-list-caption,.file-tools,.file-view-switch,.file-search-label{display:flex;align-items:center;gap:9px}.file-list-caption h3{font-size:15px;margin:0}.file-list-caption span{font-size:12px;color:var(--muted)}.file-tools{gap:10px;flex-wrap:wrap}.file-search-label{border:1px solid var(--border);background:var(--panel);border-radius:7px;padding-left:10px;color:var(--muted)}.file-search-label input{border:0;width:160px;background:transparent;font-size:12px}.file-view-switch{gap:2px;padding:3px;border-radius:8px;background:var(--panel);border:1px solid var(--border)}.file-view-switch button{font-size:11px;border-radius:5px;padding:7px 9px;white-space:nowrap;color:var(--muted)}.file-view-switch button.selected{background:var(--soft);color:var(--accent);font-weight:650}.file-items.icons{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:12px}.file-item{min-width:0;background:var(--panel);border:1px solid var(--border);border-radius:11px;display:flex;align-items:center}.file-items.icons .file-item{flex-direction:column;align-items:stretch;position:relative;padding:17px 12px 12px}.file-type-icon{display:grid;place-items:center;flex:none;background:var(--soft);border-radius:11px;color:var(--accent);font-size:12px;font-weight:750;letter-spacing:.3px}.file-items.icons .file-type-icon{height:54px;width:54px;margin:2px auto 15px;border-radius:14px;font-size:14px}.file-name-link{color:var(--text);font-size:12px;font-weight:600;overflow:hidden;text-overflow:ellipsis;text-decoration:none}.file-name-link:hover{text-decoration:underline;color:var(--accent)}.file-items.icons .file-name-link{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;overflow-wrap:anywhere;text-align:center;min-height:36px}.file-meta{font-size:11px;color:var(--muted);white-space:nowrap}.file-items.icons .file-meta{text-align:center;margin:8px 0 13px}.file-item-actions{display:flex;align-items:center;gap:8px}.file-items.icons .file-item-actions{justify-content:center;margin-top:auto;border-top:1px solid var(--border);padding-top:10px}.file-item-actions a,.file-item-actions button{font-size:11px;text-decoration:none;color:var(--accent);padding:5px 7px;border-radius:6px;white-space:nowrap}.file-item-actions a:hover,.file-item-actions button:hover{background:var(--soft)}.file-item-actions button{color:#ae6a6a}.file-items.list{display:flex;flex-direction:column;gap:7px}.file-items.list .file-item{min-height:68px;gap:14px;padding:10px 14px}.file-items.list .file-type-icon{height:42px;width:42px}.file-items.list .file-file-info{flex:1;min-width:0}.file-items.list .file-name-link{display:block;white-space:nowrap}.file-items.list .file-meta{display:block;margin-top:6px}.file-items.list .file-item-actions{margin-left:auto}.file-tip{color:var(--muted);font-size:11px;margin:22px 0;line-height:1.8}.file-items .empty{grid-column:1/-1;color:var(--muted);font-size:13px;text-align:center;background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:42px 15px}
@media(max-width:680px){.file-toolbar{align-items:flex-start}.file-tools{width:100%}.file-search-label{flex:1}.file-search-label input{width:100%;min-width:65px}.file-page .file-title{align-items:flex-start}.file-items.icons{grid-template-columns:repeat(2,minmax(0,1fr))}.file-items.list .file-item{gap:9px;padding:9px}.file-items.list .file-type-icon{width:36px;height:36px}.file-items.list .file-item-actions{gap:0}.file-items.list .file-item-actions a,.file-items.list .file-item-actions button{font-size:10px;padding:6px 4px}.file-quota{padding:18px!important}}
/* File manager: folders, multi-select and bulk actions */
.file-main-buttons{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.file-main-buttons button{white-space:nowrap}.file-breadcrumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:18px 0 14px;padding:10px 12px;border:1px solid var(--border);border-radius:9px;background:var(--panel);font-size:13px}.file-breadcrumbs button{font-size:12px;color:var(--accent);padding:5px 7px;border-radius:5px;max-width:200px;overflow:hidden;text-overflow:ellipsis}.file-breadcrumbs button:hover{background:var(--soft)}.file-breadcrumbs span{color:var(--muted)}.file-select-all{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted);white-space:nowrap;cursor:pointer}.file-select-all input,.file-item-check input{width:16px;height:16px;accent-color:var(--accent);cursor:pointer}.file-sort{border:1px solid var(--border);border-radius:8px;background:var(--panel);color:var(--text);padding:8px;font-size:12px;max-width:100px}.file-selection-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;background:var(--soft);border:1px solid var(--border);padding:12px;margin:12px 0;border-radius:10px}.file-selection-actions[hidden]{display:none}.file-selection-actions strong{font-size:12px;margin-right:8px}.file-selection-actions button{font-size:12px;padding:7px 10px;border:1px solid var(--border);border-radius:7px;background:var(--panel);color:var(--text)}.file-selection-actions .file-danger{color:#b14d4d}.file-item-check{position:absolute;top:9px;left:10px;z-index:2}.file-items.list .file-item-check{position:static}.file-item-selected{border-color:var(--accent);background:var(--soft)}.file-type-icon.is-folder{font-size:25px}.file-folder-link{border:0;background:none;cursor:pointer;font-family:inherit;overflow-wrap:anywhere;text-align:left}.file-folder-link:hover{text-decoration:underline}.file-items.icons .file-folder-link{text-align:center;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.file-items.list .file-folder-link{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;display:block}.file-destination-dialog{border:1px solid var(--border);border-radius:13px;max-width:min(90vw,470px);width:100%;padding:22px;color:var(--text);background:var(--panel)}.file-destination-dialog::backdrop{background:#0008}.file-destination-dialog label{display:flex;flex-direction:column;gap:8px;margin:18px 0}.file-destination-dialog select{width:100%;padding:12px;background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:7px}.file-drop.dragover,.file-drop.dragging{border-color:var(--accent);background:var(--soft)}
@media(max-width:680px){.file-main-buttons{width:100%;justify-content:flex-start}.file-main-buttons button{font-size:12px;padding:9px}.file-selection-actions{gap:5px}.file-selection-actions button{font-size:11px;padding:7px}.file-select-all{width:100%}.file-toolbar{gap:8px}.file-item-check{left:5px;top:5px}}

/* Logged-in favorite sorting: handle is separate from the link and star/edit buttons. */
.reorder-hint{font-size:11px;color:var(--muted);margin:0 0 13px;line-height:1.5}
body:not(.authenticated) .reorder-hint,body:not(.authenticated) .card .card-grip{display:none}
.card .card-grip{position:absolute;top:9px;right:43px;z-index:2;display:grid;place-items:center;width:27px;height:27px;cursor:grab;touch-action:none;user-select:none;background:var(--soft);color:var(--accent);border:1px solid var(--border);border-radius:6px;font-size:19px;line-height:1}
.card .card-grip:hover,.card .card-grip:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.card.favorite-dragging{opacity:.64;outline:2px solid var(--accent);outline-offset:1px;transform:none;z-index:3}
.card.favorite-dragging .card-grip{cursor:grabbing}
#cards.favorite-sorting{user-select:none}
#cards[data-size="small"] .card .card-grip{top:5px;right:28px;width:22px;height:22px;font-size:16px}

/* Heosebi Home v4 — focused workspace design refresh */
:root{
  --bg:#f4f6fa;--panel:#fff;--text:#18263b;--muted:#778398;
  --border:#e1e6ee;--accent:#375bc9;--soft:#edf2ff;
  --shadow:0 6px 25px rgba(24,44,79,.045);--radius:16px;
}
body.dark{
  --bg:#101824;--panel:#1a2535;--text:#edf2fa;--muted:#a5b2c7;
  --border:#2d3b50;--accent:#91adff;--soft:#26365a;--shadow:0 10px 26px #0002;
}
body{background:var(--bg);font-size:14px;letter-spacing:-.015em;min-height:100vh}
button,a,input,textarea,select{transition:background .15s,border-color .15s,box-shadow .15s}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
button:not(:disabled):hover{filter:brightness(.97)}
[hidden]{display:none!important}
aside{width:250px;padding:30px 22px 25px;border-color:var(--border);background:var(--panel);z-index:3;box-shadow:3px 0 20px #122a4306}
.brand{font-size:22px;font-weight:800;letter-spacing:-1px;gap:12px}
.logo{width:40px;height:40px;font-size:25px;border-radius:13px;font-family:inherit;font-weight:800;box-shadow:0 6px 12px rgba(51,91,201,.17)}
.dot{display:none}
.navlabel{font-weight:700;font-size:10px;letter-spacing:2px;margin:51px 14px 18px}
#nav{display:flex;flex-direction:column;gap:6px}
#nav button{font-size:13px;font-weight:580;padding:15px 16px;margin:0;border-radius:11px;color:var(--muted)}
#nav button:hover{background:var(--bg);color:var(--text)}
#nav button.active{background:var(--soft);color:var(--accent);font-weight:750}
.asidebottom{border-top:1px solid var(--border);padding-top:13px}
.asidebottom button{color:var(--muted);font-size:13px;padding:12px 14px;width:100%;text-align:left;border-radius:10px}
.asidebottom button:hover{background:var(--soft)}
main{margin-left:250px;padding:0 clamp(25px,4vw,66px);max-width:none}
header{position:sticky;top:0;z-index:2;height:75px;backdrop-filter:blur(18px);background:color-mix(in srgb,var(--bg) 88%,transparent);border-bottom:1px solid var(--border);color:var(--muted);font-size:11px;font-weight:650}
.headeractions{gap:10px}
.loginbutton{border:1px solid var(--border);background:var(--panel);border-radius:10px;padding:10px 13px;font-size:12px;font-weight:630;color:var(--text)}
.headeractions .loginbutton{padding:9px 14px}
#globalSearchOpen{min-width:99px}
#saveError{border:1px solid #e2b4b4;padding:7px;border-radius:8px;color:#b14b4b}
.hero{margin:31px 0 0;padding:35px 36px;background:linear-gradient(115deg,#f0f4ff 0%,#f7f9ff 58%,#e9f6f7 100%);border:1px solid #e3eafb;border-radius:22px;align-items:center;gap:20px}
body.dark .hero{background:linear-gradient(115deg,#1d2d4d 0%,#1a2538 65%,#183439 100%);border-color:#2c3a59}
.hero h1{font-size:clamp(25px,3.1vw,38px);font-weight:760;letter-spacing:-1.4px;margin:11px 0}
.hero h1 span{color:var(--accent)}
.hero p{font-size:13px;margin:0;line-height:1.7;color:var(--muted)}
.hero .eyebrow{font-size:12px;font-weight:600;letter-spacing:0;color:var(--accent)}
.hero .clock{font-size:35px;font-weight:650;letter-spacing:-1.5px;color:var(--text)}
body:not([data-page="대시보드"]) .hero{display:none}
.searchbar{margin-top:25px;box-shadow:var(--shadow);border-radius:14px;padding:14px 20px}
.searchbar input{font-size:13px}
.workspace{margin-top:27px;min-width:0}
.sectiontop h2{font-size:22px;font-weight:760;letter-spacing:-.65px}
.sectiontop h2 #count{font-size:12px;font-weight:650;vertical-align:middle}
.primary{background:#375bc9;color:white;border-radius:10px;font-size:12px;font-weight:700;padding:12px 17px}
body.dark .primary{background:#6186ee;color:#fff}
.card,.widget,.file-item,.file-items .empty{background:var(--panel);box-shadow:var(--shadow);border:1px solid var(--border);border-radius:var(--radius)}
#cards{grid-template-columns:repeat(auto-fill,minmax(185px,1fr));gap:15px}
.card{min-height:155px;overflow:hidden}
.card:hover{border-color:var(--accent);box-shadow:0 9px 26px #244e8116;transform:translateY(-2px)}
.card a{padding:22px 18px 17px;height:100%}
.card .icon{width:38px;height:38px;margin-bottom:16px;border-radius:13px;background:var(--soft);font-size:17px}
.card:nth-child(n) .icon{background:var(--soft);color:var(--accent)}
.card strong{font-size:14px;font-weight:700;max-width:85%}
.card small{font-size:11px}
.card-tags{display:flex;gap:5px;margin-top:12px;flex-wrap:wrap}
.card-tags em{font-size:10px;font-style:normal;background:var(--bg);color:var(--muted);border:1px solid var(--border);padding:3px 7px;border-radius:99px;max-width:88px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.card .card-grip{border-color:var(--border);background:var(--soft);border-radius:8px}
#filters{margin:0;align-items:center}
#filters button{font-size:12px;font-weight:580;border:1px solid transparent;padding:9px 12px;border-radius:9px}
#filters button.active{background:var(--soft);color:var(--accent);border-color:var(--border)}
.favorites-toolbar{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;gap:14px;margin:22px 0}
.favorites-toolbar label,.tag-filter-label,.view-setting{font-size:12px;color:var(--muted);white-space:nowrap}
.favorites-toolbar select{border-radius:9px;margin-left:4px;padding:8px;font-size:12px;max-width:160px}
.group-actions{gap:9px}
.page-panel{max-width:none}
.page-panel .widget{margin-top:17px}
.note{background:var(--panel);color:var(--text);border-color:var(--border)}
.dark .note{background:var(--panel);color:var(--text);border-color:var(--border)}
.note textarea{line-height:1.85;padding:15px}
.file-quota{box-shadow:var(--shadow)!important;border-radius:var(--radius)!important}
.file-drop{border-color:var(--border);background:var(--panel);padding:29px 12px;border-radius:var(--radius)}
.file-drop:hover,.file-drop.dragover{background:var(--soft);border-color:var(--accent)}
.file-drop strong{font-weight:650}
.file-meter{background:var(--bg)}
.file-breadcrumbs{border-radius:12px;box-shadow:var(--shadow)}
.file-selection-actions{border-radius:12px}
.file-items.icons{grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:14px}
.file-items.icons .file-item{padding:20px 12px 13px}
.file-type-icon{border-radius:12px}
.file-items.icons .file-type-icon{background:var(--soft)}
.file-name-link{font-size:13px}
.file-item.vault-dragging{opacity:.4}
.file-item.vault-drop-target{outline:2px dashed var(--accent);outline-offset:3px;background:var(--soft)}
.file-preview-dialog{width:min(95vw,1000px);max-width:1000px;max-height:92vh;padding:0;overflow:hidden;border-radius:16px}
.file-preview-header{padding:17px 22px;display:flex;justify-content:space-between;align-items:center;gap:15px;border-bottom:1px solid var(--border)}
.file-preview-header>div:first-child{min-width:0;display:flex;flex-direction:column;gap:7px}
.file-preview-header strong{font-size:15px;max-width:54vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.file-preview-header small{font-size:11px;color:var(--muted)}
.file-preview-actions{display:flex;align-items:center;gap:7px}
.file-preview-actions a{text-decoration:none}
.file-preview-content{height:min(73vh,770px);padding:20px;display:flex;align-items:center;justify-content:center;overflow:auto}
.file-preview-content img,.file-preview-content video{max-width:100%;max-height:100%;object-fit:contain}
.file-preview-content iframe{width:100%;height:100%;border:0;background:white}
.file-preview-content audio{width:min(480px,100%)}
.file-preview-content pre{align-self:stretch;justify-self:stretch;width:100%;margin:0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;line-height:1.7;font-family:ui-monospace,Consolas,monospace}
.dashboard-heading{margin-bottom:18px}
.dashboard-heading .overline{font-size:10px;letter-spacing:2px;color:var(--accent);font-weight:750;margin-bottom:9px}
.dash-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}
.dash-stat{display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:8px;position:relative;min-width:0;min-height:145px;padding:21px;border:1px solid var(--border);border-radius:var(--radius);background:var(--panel);box-shadow:var(--shadow)}
.dash-stat:hover{border-color:var(--accent);transform:translateY(-1px)}
.dash-stat>span:first-child{font-size:12px;font-weight:650;color:var(--muted)}
.dash-stat strong{font-size:clamp(21px,2.5vw,31px);font-weight:750;letter-spacing:-1px;font-variant-numeric:tabular-nums;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.dash-stat small{font-size:11px;color:var(--muted)}
.dash-meter{margin-top:auto;height:5px;background:var(--bg);border-radius:8px;width:100%;overflow:hidden}
.dash-meter span{display:block;height:100%;background:var(--accent);border-radius:8px;transition:width .2s}
.dash-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:19px}
.dash-panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:21px;min-height:203px;min-width:0;box-shadow:var(--shadow)}
.dash-panel-head{display:flex;justify-content:space-between;align-items:center;gap:9px;margin-bottom:16px}
.dash-panel h3{font-size:15px;font-weight:760;letter-spacing:-.3px;margin:0}
.dash-panel-head button{font-size:11px;color:var(--accent);font-weight:650;white-space:nowrap}
.dash-quicklinks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.dash-link{border:1px solid var(--border);border-radius:11px;text-decoration:none;color:var(--text);display:flex;align-items:center;min-width:0;gap:9px;padding:11px}
.dash-link:hover{background:var(--soft);border-color:var(--accent)}
.dash-link-icon{background:var(--soft);width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex:none;color:var(--accent);font-weight:750}
.dash-link>span:nth-child(2){display:flex;flex-direction:column;gap:4px;min-width:0}
.dash-link strong,.dash-recent-label strong{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700}
.dash-link small,.dash-recent-label small{font-size:10px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dash-arrow{margin-left:auto;color:var(--muted)}
.dash-recent{display:flex;flex-direction:column}
.dash-recent-row,.dash-todo-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--border);min-width:0}
.dash-recent-row:last-child,.dash-todo-row:last-child{border-bottom:0}
.dash-document-icon{background:var(--soft);color:var(--accent);font-size:10px;font-weight:800;border-radius:8px;width:38px;height:34px;display:grid;place-items:center;flex:none}
.dash-recent-label{min-width:0;flex:1;display:flex;flex-direction:column;gap:4px}
.dash-recent-row button{color:var(--accent);padding:7px;font-size:11px}
.dash-todo-row{font-size:12px;line-height:1.5}
.dash-todo-dot{border:2px solid var(--accent);border-radius:50%;width:14px;height:14px;flex:none}
.dash-note{white-space:pre-wrap;font-size:13px;line-height:1.8;color:var(--muted);overflow-wrap:anywhere;max-height:200px;overflow:hidden}
.unified-search-dialog{width:min(94vw,680px);max-width:680px;max-height:80vh;top:10%;transform:none;padding:0;overflow:hidden;box-shadow:0 25px 75px #0004}
.unified-search-head{display:flex;align-items:center;gap:11px;padding:15px 19px;border-bottom:1px solid var(--border)}
.unified-search-head>span{font-size:24px;color:var(--accent)}
.unified-search-head input{background:transparent;border:0;outline:0;font-size:15px;flex:1;min-width:0}
.unified-search-head button{color:var(--muted);font-size:17px}
.unified-search-results{overflow:auto;max-height:58vh;padding:9px}
.search-result-section{font-size:10px;letter-spacing:1px;color:var(--accent);font-weight:760;padding:14px 12px 7px}
.search-result{display:flex;align-items:center;gap:13px;width:100%;text-align:left;text-decoration:none;color:var(--text);padding:11px 12px;border-radius:10px;font-size:12px;min-width:0}
.search-result:hover{background:var(--soft)}
.search-result>span{color:var(--accent);font-size:19px;flex:none;width:24px;text-align:center}
.search-result strong{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:650}
.search-result small{color:var(--muted);overflow:hidden;text-overflow:ellipsis;max-width:40%;white-space:nowrap}
.search-empty{padding:20px;color:var(--muted);text-align:center;font-size:12px}
.search-footer{font-size:10px;color:var(--muted);background:var(--bg);padding:11px 20px;border-top:1px solid var(--border)}
.input-hint{display:block;margin-top:5px;font-size:11px;color:var(--muted)}
#toast{border-radius:11px;box-shadow:0 10px 24px #0002;z-index:7}
@media(min-width:1450px){#cards{grid-template-columns:repeat(auto-fill,minmax(195px,1fr))}}
@media(max-width:1100px){aside{width:208px;padding:28px 15px}main{margin-left:208px;padding:0 25px}.dash-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.dash-columns{gap:13px}#cards{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}}
@media(max-width:800px){aside{position:static;width:100%;height:auto;padding:13px 18px 6px;border-bottom:1px solid var(--border)}.brand{font-size:19px}.logo{width:31px;height:31px;font-size:21px}.navlabel{display:none}#nav{flex-direction:row;gap:4px;overflow:auto;margin:9px 0 6px;scrollbar-width:none}#nav::-webkit-scrollbar{display:none}#nav button{width:auto;flex:none;white-space:nowrap;padding:11px 13px;font-size:12px}.asidebottom{display:none}main{margin-left:0;padding:0 17px}header{height:55px}.hero{margin-top:15px;padding:23px}.hero .clock{font-size:26px}.dash-columns{grid-template-columns:1fr 1fr}.dash-panel{padding:15px}#cards{grid-template-columns:repeat(auto-fill,minmax(158px,1fr))}.workspace{margin-top:19px}}
@media(max-width:610px){header{font-size:10px}.headeractions{gap:6px}.headeractions .loginbutton{font-size:11px;padding:9px}.hero{padding:20px}.hero h1{font-size:24px}.hero .clock{font-size:23px}.hero p{font-size:11px}.dash-stats{gap:9px}.dash-stat{padding:15px;min-height:125px}.dash-stat strong{font-size:24px}.dash-columns{grid-template-columns:1fr;gap:10px}.dash-panel{min-height:145px}.dash-quicklinks{grid-template-columns:repeat(2,minmax(0,1fr))}.sectiontop{gap:10px}.sectiontop h2{font-size:20px}.file-toolbar .file-tools{gap:6px}.file-items.icons{grid-template-columns:repeat(2,minmax(0,1fr))}.file-preview-content{height:66vh;padding:9px}.file-preview-header{padding:12px;gap:7px}.file-preview-actions a{padding:9px}.favorites-toolbar{justify-content:flex-start}.favorites-toolbar #filters{flex-basis:100%}.headeractions #globalSearchOpen{min-width:auto}.file-drop{padding:20px}.file-drop strong{font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}

/* v4.1: maximize the file manager, reduce wasted whitespace elsewhere. */


body[data-page="파일 저장소"] .workspace{margin-top:16px}
#filePage{display:block;width:100%;max-width:none;min-width:0}
#filePage[hidden]{display:none!important}
#dashboardPage,#linkPage,#notePage,#todoPage{max-width:1180px;margin-inline:auto;width:100%}
.file-overview-row{display:grid;grid-template-columns:minmax(320px,1.4fr) minmax(260px,1fr);gap:15px;align-items:stretch;margin:16px 0 12px}
.file-overview-row .file-quota{margin:0!important;padding:17px 21px!important;display:flex;flex-direction:column;justify-content:center}
.file-overview-row .file-meter{margin-top:13px}
.file-overview-row .file-drop{padding:13px 15px;min-height:108px;flex-direction:row;flex-wrap:wrap;gap:6px 12px;border-radius:14px}
.file-overview-row .file-drop-icon{font-size:24px;flex:none}
.file-overview-row .file-drop strong{font-size:13px;text-align:left}
.file-overview-row .file-drop small{width:100%;font-size:11px}
.file-title h2{font-size:21px}
.file-breadcrumbs{margin:12px 0 9px}
.file-toolbar{margin:12px 0 12px;gap:10px}
.file-tools{justify-content:flex-end}
.file-search-label input{width:180px}
.file-items{min-height:200px;width:100%;min-width:0}
.file-items.icons{grid-template-columns:repeat(auto-fill,minmax(185px,1fr));gap:12px}
.file-items.list .file-item{min-height:60px;padding:9px 15px}
.file-items.icons .file-item{min-height:178px}
.file-preview-dialog{width:min(97vw,1350px);max-width:1350px;height:min(92vh,950px);max-height:92vh;display:flex;flex-direction:column}
.file-preview-dialog:not([open]){display:none}
.file-preview-content{flex:1;min-height:0;height:auto;padding:14px;display:block;overflow:auto}
.file-preview-content img,.file-preview-content video{display:block;margin:auto;max-height:100%}
.file-preview-content iframe{min-height:100%}
.file-preview-content>pre{width:100%}
.document-preview{height:100%;min-height:0;display:flex;flex-direction:column;gap:10px;width:100%}
.document-preview-note{padding:10px 12px;border:1px solid var(--border);border-radius:9px;background:var(--soft);font-size:12px;color:var(--muted)}
.document-preview pre{white-space:pre-wrap;overflow-wrap:anywhere;overflow:auto;flex:1;margin:0;font-size:13px;line-height:1.7;font-family:ui-monospace,'Malgun Gothic',Consolas,monospace}
.sheet-preview{width:100%;height:100%;display:flex;flex-direction:column;min-width:0;gap:9px}
.sheet-preview-toolbar{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.sheet-preview-toolbar label,.sheet-preview-pager{font-size:12px;display:flex;gap:8px;align-items:center}
.sheet-preview-toolbar select{min-width:130px;max-width:300px;padding:7px 10px}
.sheet-preview-pager button{background:var(--panel);border:1px solid var(--border);padding:8px 11px;border-radius:8px}
.sheet-preview-scroll{flex:1;min-height:0;overflow:auto;border:1px solid var(--border);border-radius:10px;background:var(--panel)}
.sheet-preview-table{border-collapse:separate;border-spacing:0;font-size:12px;width:max-content;min-width:100%}
.sheet-preview-table th,.sheet-preview-table td{border-right:1px solid var(--border);border-bottom:1px solid var(--border);padding:9px 11px;min-width:115px;max-width:320px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left}
.sheet-preview-table thead th{position:sticky;top:0;background:var(--soft);z-index:2;font-weight:700}
.sheet-preview-table tbody th{position:sticky;left:0;background:var(--soft);min-width:54px;text-align:center;z-index:1}
.sheet-preview-table thead th:first-child{position:sticky;left:0;z-index:3;min-width:54px}
.sheet-preview-table tbody tr:hover td{background:var(--bg)}
.sheet-preview-note{color:var(--muted);font-size:11px}
@media(max-width:980px){.file-overview-row{grid-template-columns:1fr 1fr}.file-tools{justify-content:flex-start}.file-page .file-title{align-items:flex-start}}

@media(max-width:680px){.file-overview-row{grid-template-columns:1fr}.file-overview-row .file-drop{min-height:75px;padding:12px}.file-items.icons{grid-template-columns:repeat(2,minmax(0,1fr))}.file-search-label input{width:100%}.file-preview-dialog{width:98vw}.sheet-preview-toolbar{align-items:flex-start;flex-direction:column}.sheet-preview-table td{min-width:95px;max-width:200px}}

/* Guest view: protected panels are completely absent, even before auth check finishes. */
body:not(.authenticated) [data-auth-only]{display:none!important}
body:not(.authenticated) #filePage,
body:not(.authenticated) #notePage,
body:not(.authenticated) #todoPage{display:none!important}
/* Persistent upload failure modal instead of an easily missed inline status. */
.upload-failure-dialog{width:min(92vw,450px);padding:25px;box-shadow:0 22px 65px #0003}
.upload-failure-icon{display:grid;place-items:center;width:40px;height:40px;background:#fee9e9;color:#ad3131;font-weight:800;font-size:24px;border-radius:12px;margin-bottom:15px}
.upload-failure-dialog h2{font-size:19px;letter-spacing:-.5px}
.upload-failure-file{color:var(--muted);font-size:13px;overflow-wrap:anywhere;margin:15px 0 4px}
.upload-failure-reason{font-size:14px;line-height:1.7;white-space:pre-line;overflow-wrap:anywhere}
.upload-failure-actions{justify-content:flex-end;margin-top:21px}
.upload-failure-actions .primary{padding:11px 24px;font-size:13px}

/* Group color coding: tint against current panel to preserve dark-mode contrast. */
#cards .card.group-colored{background:color-mix(in srgb,var(--group-color) 18%,var(--panel));border-color:color-mix(in srgb,var(--group-color) 40%,var(--border));}
#cards .card.group-colored:hover{border-color:var(--group-color);}
#cards .card.group-colored .icon{background:color-mix(in srgb,var(--group-color) 33%,var(--panel));color:var(--text);}
#filters button.group-colored{background:color-mix(in srgb,var(--group-color) 25%,var(--panel));border-color:color-mix(in srgb,var(--group-color) 45%,var(--border));color:var(--text);}
#filters button.group-colored.active{background:color-mix(in srgb,var(--group-color) 42%,var(--panel));border-color:var(--group-color);font-weight:750;}
.dash-link.group-colored{background:color-mix(in srgb,var(--group-color) 15%,var(--panel));border-color:color-mix(in srgb,var(--group-color) 35%,var(--border));}
.dash-link.group-colored .dash-link-icon{background:color-mix(in srgb,var(--group-color) 28%,var(--panel));color:var(--text);}
#groupDialog{width:min(640px,96vw)}
.group-row{gap:6px}
.group-row input[data-group-input]{min-width:90px;flex:1}
.group-color-picker{display:inline-flex!important;align-items:center;justify-content:center;flex:0 0 auto;margin:0!important;padding:3px;border:1px solid var(--border);border-radius:9px;background:var(--panel);cursor:pointer}
.group-color-picker input[type=color]{appearance:none;-webkit-appearance:none;width:32px;height:30px;min-width:32px;min-height:30px;padding:0;margin:0!important;display:block!important;flex:none!important;background:none;border:none;border-radius:6px;cursor:pointer}
.group-color-picker input[type=color]::-webkit-color-swatch-wrapper{padding:1px}
.group-color-picker input[type=color]::-webkit-color-swatch{border:1px solid var(--border);border-radius:5px}
.group-color-picker input[type=color]::-moz-color-swatch{border:1px solid var(--border);border-radius:5px}
.group-row button[data-group-color-reset]{font-size:11px;color:var(--muted)}
.group-row button[data-group-color-reset]:disabled{opacity:.35;cursor:default}
.group-add input#newGroup{flex:1;min-width:80px}
@media(max-width:600px){.group-row{flex-wrap:wrap;padding:10px 0;border-bottom:1px solid var(--border)}.group-row input[data-group-input]{flex:1 1 calc(100% - 65px)}.group-add{flex-wrap:wrap}.group-row button[data-group-rename],.group-row button[data-group-delete]{padding:6px}}

/* Private cross-device quick transfer */
body[data-page="빠른 전송"] .workspace{max-width:1180px;margin-inline:auto}
.quick-transfer-page{min-width:0}
.quick-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:19px}
.quick-header p{margin:7px 0 0;color:var(--muted);font-size:12px}
.quick-panels{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.quick-panel{padding:22px!important;border:1px solid var(--border);border-radius:15px;background:var(--panel);min-width:0}
.quick-panel-title{display:flex;align-items:center;gap:11px;margin-bottom:16px;font-size:14px}
.quick-panel-icon{display:grid;place-items:center;width:35px;height:35px;background:var(--soft);border-radius:10px;color:var(--accent);font-size:22px}
#quickText{display:block;box-sizing:border-box;resize:vertical;min-height:143px;width:100%;padding:14px;background:var(--bg);border:1px solid var(--border);border-radius:10px;color:var(--text);font:inherit;font-size:13px;line-height:1.6}
#quickText:focus{outline:2px solid var(--accent);outline-offset:2px}
.quick-panel-footer{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:14px}
.quick-panel-footer small{font-size:11px;color:var(--muted)}
.quick-file-drop{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;gap:10px;min-height:143px;padding:16px;border:2px dashed var(--border);border-radius:10px;background:var(--bg);color:var(--text);cursor:pointer}
.quick-file-drop:hover,.quick-file-drop.dragging{background:var(--soft);border-color:var(--accent)}
.quick-file-drop strong{font-size:14px;color:var(--accent)}
.quick-file-drop small{font-size:11px;color:var(--muted);text-align:center}
.quick-upload-progress{margin-top:15px;border-top:1px solid var(--border);padding-top:13px}
.quick-progress-head{display:flex;justify-content:space-between;gap:12px;font-size:11px;overflow-wrap:anywhere}
.quick-progress-head strong{max-width:58%}
.quick-progress-head span{white-space:nowrap;color:var(--muted)}
.quick-meter{height:8px;background:var(--soft);border-radius:99px;overflow:hidden;margin:11px 0}
.quick-meter span{display:block;height:100%;width:0;background:var(--accent);transition:width .14s}
.quick-inbox-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:31px 0 13px}
.quick-inbox-head h3{font-size:16px;margin:0 0 5px}
.quick-inbox-head h3 span{color:var(--accent)}
.quick-inbox-head small{color:var(--muted);font-size:11px}
.quick-items{display:grid;gap:10px}
.quick-item{display:flex;gap:14px;align-items:start;min-width:0;background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:17px}
.quick-item-icon{display:grid;place-items:center;width:45px;height:45px;flex:none;border-radius:12px;background:var(--soft);color:var(--accent);font-weight:bold;font-size:22px}
.quick-item-body{flex:1;min-width:0}
.quick-item-top{display:flex;flex-wrap:wrap;gap:9px;align-items:center;justify-content:space-between}
.quick-item-top strong{font-size:13px;overflow-wrap:anywhere}
.quick-item-top span,.quick-size{font-size:11px;color:var(--muted)}
.quick-item-top span{white-space:nowrap}
.quick-size{margin:9px 0 0}
.quick-text{margin:10px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;max-height:140px;overflow:auto;line-height:1.65;color:var(--text);font:inherit;font-size:12px}
.quick-item-actions{display:flex;gap:7px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.quick-item-actions button,.quick-item-actions a{font-size:12px;padding:9px 11px;white-space:nowrap;text-decoration:none}
.quick-remove{border:1px solid var(--border);border-radius:9px;color:var(--muted);background:var(--panel)}
.quick-remove:hover{color:#b24b4b}
.quick-download{display:inline-flex;align-items:center}
.quick-empty{padding:55px 17px;text-align:center;color:var(--muted);border:1px dashed var(--border);border-radius:12px;background:var(--panel);font-size:13px}
.quick-empty small{display:block;margin-top:10px;font-size:11px}
.quick-footnote{font-size:11px;color:var(--muted);margin:16px 0 36px}
@media(max-width:1050px){.quick-panels{grid-template-columns:1fr}}
@media(max-width:680px){.quick-item{flex-wrap:wrap;gap:10px}.quick-item-body{flex-basis:calc(100% - 60px)}.quick-item-actions{width:100%;justify-content:flex-start;padding-left:55px}.quick-header h2{font-size:18px}.quick-panel{padding:16px!important}}

/* Multi-note workspace / temporary sharing */
.memo-layout{display:grid;grid-template-columns:minmax(235px,290px) minmax(0,1fr);min-height:580px;overflow:hidden;padding:0!important;gap:0!important}
.memo-sidebar{border-right:1px solid var(--line,#dde4ee);min-width:0;padding:18px;background:var(--surface,#fafbfd)}
.memo-sidebar>input{width:100%;padding:11px 12px;border:1px solid var(--line,#d8e0eb);border-radius:10px;background:var(--panel,#fff);color:inherit}
.memo-count{font-size:12px;opacity:.65;margin:16px 4px 8px}
.memo-list{display:flex;flex-direction:column;gap:6px;max-height:68vh;overflow-y:auto}
.memo-list-item{border:1px solid transparent;background:transparent;color:inherit;border-radius:12px;padding:13px 12px;width:100%;text-align:left;display:flex;flex-direction:column;gap:5px;cursor:pointer;max-width:100%}
.memo-list-item.active{background:color-mix(in srgb,var(--accent,#376be8) 12%,transparent);border-color:color-mix(in srgb,var(--accent,#376be8) 25%,transparent)}
.memo-list-item strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.memo-list-item small{opacity:.67;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.memo-list-item em{font-size:11px;opacity:.55;font-style:normal}
.memo-editor{padding:22px;min-width:0}
.memo-empty{min-height:300px;display:flex;align-items:center;justify-content:center;opacity:.55;text-align:center}
.memo-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--muted,#66788c);margin-bottom:18px}
.memo-actions>div{display:flex;gap:8px}
#memoEditArea{width:100%}
#memoTitle{font-weight:750;font-size:22px;width:100%;border:0;border-bottom:1px solid var(--line,#dae1ea);border-radius:0;padding:12px 4px;margin-bottom:12px;background:transparent;color:inherit;outline-offset:4px}
#memoBody{display:block;min-height:395px;width:100%;border:0;resize:vertical;line-height:1.7;font-size:15px;background:transparent;color:inherit;padding:10px 4px;outline-offset:4px}
#memoEditArea>small{opacity:.55}
.dash-note-link{display:flex;flex-direction:column;align-items:flex-start;width:100%;padding:12px;background:transparent;border:0;border-bottom:1px solid var(--line,#dce3ec);color:inherit;text-align:left;cursor:pointer;gap:5px;min-width:0}
.dash-note-link strong,.dash-note-link small{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dash-note-link small{opacity:.6}
.file-item[data-vault-target]{cursor:default}
.file-item[data-vault-target] .file-file-info{cursor:pointer}
.quick-share-dialog{width:min(95vw,540px);border:0;border-radius:20px;padding:24px;color:var(--text,#1b2939);background:var(--panel,#fff)}
.quick-share-dialog p{line-height:1.7}
.quick-share-dialog label{display:block;margin-top:16px}
.quick-share-dialog input{box-sizing:border-box;width:100%;margin-top:8px;padding:11px;border-radius:9px;border:1px solid #bac6d4}
.quick-item-actions{flex-wrap:wrap}
@media(max-width:720px){.memo-layout{grid-template-columns:1fr;min-height:0}.memo-sidebar{border-right:0;border-bottom:1px solid var(--line,#dce3ec);padding:12px}.memo-list{max-height:200px}.memo-editor{padding:14px}.memo-empty{min-height:190px}#memoBody{min-height:320px}}

.file-item[data-vault-target]:focus-visible{outline:3px solid #3b68d8;outline-offset:3px}
.file-item[data-vault-target] .file-folder-link{display:inline-block;cursor:default}
/* Fix memo editor overlapping with the global fixed left navigation. */
#notePage .memo-layout{display:grid;grid-template-columns:minmax(240px,290px) minmax(0,1fr);min-width:0;background:var(--panel);border:1px solid var(--border);overflow:hidden;gap:0}
#notePage .memo-layout > aside.memo-sidebar{position:relative!important;inset:auto!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;width:auto!important;height:auto!important;min-height:580px!important;margin:0!important;padding:16px!important;border:0!important;border-right:1px solid var(--border)!important;background:var(--panel)!important;color:var(--text)!important;box-shadow:none!important;transform:none!important;z-index:auto!important;overflow:hidden}
#notePage .memo-sidebar input,#notePage .memo-sidebar .memo-list-item{background:var(--panel);color:var(--text)}
#notePage .memo-sidebar input{border:1px solid var(--border)}
#notePage .memo-sidebar .memo-list-item.active{background:color-mix(in srgb,var(--accent) 16%,var(--panel));border-color:var(--border)}
#notePage .memo-sidebar .memo-list-item small,#notePage .memo-sidebar .memo-list-item em,#notePage .memo-count{color:var(--muted);opacity:1}
#notePage .memo-editor{background:var(--panel);color:var(--text);min-width:0;position:relative;overflow:hidden}
@media(max-width:720px){#notePage .memo-layout{grid-template-columns:minmax(0,1fr)}#notePage .memo-layout > aside.memo-sidebar{min-height:0!important;border-right:0!important;border-bottom:1px solid var(--border)!important}}
/* Single-file and folder synchronization portal. */
.pcs-page{width:100%;max-width:1180px;margin:0 auto}.pcs-top{align-items:flex-start;gap:15px;margin-bottom:16px}.pcs-top p{font-size:12px;line-height:1.7;margin:8px 0 0;color:var(--muted)}
.pcs-summary{display:flex;align-items:center;flex-wrap:wrap;gap:12px 23px;padding:12px 15px;border:1px solid var(--border);border-radius:12px;background:var(--panel);font-size:12px;margin-bottom:15px}.pcs-summary span{color:var(--muted)}.pcs-summary strong{color:var(--text);margin-left:7px;font-size:15px}.pcs-summary button{margin-left:auto}
.pcs-setup{background:color-mix(in srgb,var(--accent) 5%,var(--panel));padding:17px 21px;border:1px solid var(--border);border-radius:12px;margin-bottom:28px}.pcs-setup strong{font-size:13px}.pcs-setup p{font-size:12px;line-height:1.8;margin:8px 0}.pcs-setup small{color:var(--muted);font-size:11px}
.pcs-heading{font-size:15px;margin:16px 0 11px}.pcs-devices{display:grid;grid-template-columns:repeat(auto-fill,minmax(285px,1fr));gap:11px}.pcs-device{display:flex;gap:12px;padding:16px;border:1px solid var(--border);border-radius:12px;background:var(--panel);align-items:center}.pcs-device-symbol{width:38px;height:38px;border-radius:10px;background:var(--soft);display:grid;place-items:center;font-size:21px;color:var(--accent)}.pcs-device-name{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}.pcs-device-name strong{font-size:13px;overflow-wrap:anywhere}.pcs-device-name small{font-size:10px;color:var(--muted)}.pcs-device button{font-size:11px;padding:9px 10px}
.pcs-files-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:24px}.pcs-files-head label{max-width:240px}.pcs-files-head input{width:100%;font-size:12px}.pcs-sources{display:grid;gap:10px;margin-top:8px}.pcs-source{border:1px solid var(--border);border-radius:13px;background:var(--panel);overflow:hidden}.pcs-source summary{padding:15px;display:flex;align-items:center;gap:12px;cursor:pointer;list-style:none}.pcs-source summary::-webkit-details-marker{display:none}.pcs-source summary strong{font-size:13px;overflow-wrap:anywhere}.pcs-source-icon{font-size:23px}.pcs-source-device,.pcs-source-count{font-size:11px;color:var(--muted)}.pcs-source-count{margin-left:auto;white-space:nowrap}.pcs-source-items{border-top:1px solid var(--border)}.pcs-file{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--border)}.pcs-file-icon{width:35px;height:35px;flex:none;display:grid;place-items:center;border-radius:9px;background:var(--soft);font-weight:600;font-size:10px;color:var(--accent)}.pcs-file-info{min-width:0;flex:1;display:flex;flex-direction:column;gap:6px}.pcs-file-info strong{font-weight:500;font-size:12px;overflow-wrap:anywhere}.pcs-file-info span{font-size:10px;color:var(--muted)}.pcs-file-actions{display:flex;align-items:center;gap:7px}.pcs-file-actions button,.pcs-file-actions a{font-size:11px;padding:8px 10px;white-space:nowrap;text-decoration:none}.pcs-source-footer{display:flex;justify-content:flex-end;padding:10px 15px}.pcs-source-footer button{font-size:11px;color:#b96868}.pcs-note{font-size:11px;color:var(--muted);margin:19px 0 35px;line-height:1.65}
.pcs-token-dialog{width:min(92vw,560px)}.pcs-token-dialog p{line-height:1.6}.pcs-token-dialog textarea{width:100%;box-sizing:border-box;margin-top:8px;padding:12px;word-break:break-all;resize:none;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:8px}.pcs-token-dialog input{color:var(--text);background:var(--bg)}
@media(max-width:710px){.pcs-top{flex-wrap:wrap}.pcs-files-head{flex-wrap:wrap}.pcs-file{flex-wrap:wrap}.pcs-file-info{flex-basis:calc(100% - 60px)}.pcs-file-actions{margin-left:48px}}

/* Read-only virtual directory: 동기화 / PC / files and folders */
#filePage.sync-browser .file-main-buttons,#filePage.sync-browser #fileDrop,#filePage.sync-browser .file-tip{display:none!important}
#filePage.sync-browser .file-overview-row{grid-template-columns:1fr}
#filePage.sync-browser .file-overview-row .file-quota{min-height:80px}
#filePage.sync-browser .file-item{cursor:default}
#filePage.sync-browser [data-vault-target]{cursor:pointer}
#filePage.sync-browser .file-item-actions{flex-shrink:0}
.pcs-file-tip{font-size:12px;color:var(--muted);display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.pcs-file-tip button{font-size:12px}
/* Private blog */
.blog-page{max-width:1100px;margin:auto}.blog-filters,.blog-fields,.blog-actions{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}.blog-filters input{flex:1;min-width:180px}.blog-filters input,.blog-filters select,.blog-fields input,.blog-fields select,.blog-title-input{border:1px solid var(--border,#d6d9e2);background:var(--surface,#fff);color:inherit;border-radius:10px;padding:12px;font:inherit}.blog-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px}.blog-card{border:1px solid var(--border,#d6d9e2);border-radius:16px;overflow:hidden;text-align:left;background:var(--surface,#fff);color:inherit;cursor:pointer;padding:0;display:flex;flex-direction:column;min-height:160px}.blog-card>img{width:100%;height:165px;object-fit:cover}.blog-card-body{display:grid;gap:9px;padding:17px}.blog-card-body strong{font-size:18px}.blog-card-body small,.blog-card-body span{color:var(--muted,#888)}.blog-article{max-width:800px;margin:28px auto;padding:22px}.blog-article h1{font-size:clamp(27px,4vw,42px);line-height:1.3;margin:18px 0 35px}.blog-title-input{display:block;width:100%;font-size:29px;font-weight:700;margin-top:20px}.blog-fields input{flex:1;min-width:130px}.blog-fields label{display:flex;align-items:center;gap:7px}.blog-toolbar{display:flex;gap:5px;flex-wrap:wrap;padding:12px;border:1px solid var(--border,#d6d9e2);border-radius:12px 12px 0 0}.blog-toolbar button{padding:8px 11px;border-radius:7px;border:1px solid var(--border,#d6d9e2);background:transparent;color:inherit;cursor:pointer}.blog-content{min-height:460px;border:1px solid var(--border,#d6d9e2);border-top:0;border-radius:0 0 12px 12px;padding:25px;outline:none}.blog-content:empty:before{content:attr(data-placeholder);color:#999}.blog-prose{line-height:1.9;overflow-wrap:anywhere;font-size:16px}.blog-prose img{max-width:100%;height:auto;border-radius:9px;display:block;margin:20px auto}.blog-prose blockquote{border-left:4px solid #a3a3a3;padding:10px 20px;margin:20px 0;background:rgba(127,127,127,.06)}.blog-hint{font-size:12px;opacity:.7;margin-top:12px}@media(max-width:600px){.blog-article{padding:5px}.blog-content{padding:14px}.blog-title-input{font-size:23px}}

/* Public blog listings; editor controls remain admin-only. */
body:not(.authenticated) #blogNew,body:not(.authenticated) #blogEditBtn,body:not(.authenticated) #blogEditor{display:none!important}
.blog-reader-actions{display:flex;justify-content:flex-end;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:20px}
.blog-card small{line-height:1.6}
.blog-fields select{max-width:100%;min-width:160px}

/* Unified blog editor: reuse the site's design tokens across light/dark modes. */
.blog-page .sectiontop{align-items:center;gap:12px}
.blog-filters,.blog-fields{align-items:center}
.blog-filters .loginbutton,.blog-fields .loginbutton{white-space:nowrap}
.blog-page input,.blog-page select,.blog-page button{accent-color:var(--accent)}
.blog-filters input,.blog-filters select,.blog-fields input,.blog-fields select,.blog-title-input{background:var(--panel);color:var(--text);border-color:var(--border)}
.blog-list{gap:15px}.blog-card{background:var(--panel);border-color:var(--border);box-shadow:var(--shadow);transition:border-color .15s,transform .15s,box-shadow .15s}
.blog-card:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 8px 22px #0001}
.blog-card-body small{color:var(--muted)}.blog-card-body strong{color:var(--text)}
.blog-actions{position:sticky;top:74px;z-index:1;padding:12px;background:var(--bg);border-bottom:1px solid var(--border);border-radius:10px;align-items:center}
.blog-article{background:var(--panel);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);padding:clamp(18px,4vw,45px)}
.blog-toolbar{background:var(--panel);border-color:var(--border);gap:7px}
.blog-toolbar button{background:var(--bg);border-color:var(--border);color:var(--text);font-weight:600}
.blog-toolbar button:hover{background:var(--soft);color:var(--accent)}
.blog-content{background:var(--panel);color:var(--text);border-color:var(--border);line-height:1.85;box-shadow:var(--shadow)}
.blog-prose img{cursor:default;max-width:100%;height:auto}
.blog-content img{cursor:pointer}
.blog-content img.blog-image-selected{outline:3px solid var(--accent);outline-offset:4px}
.blog-prose img[data-align="left"]{margin-left:0;margin-right:auto}
.blog-prose img[data-align="center"]{margin-left:auto;margin-right:auto}
.blog-prose img[data-align="right"]{margin-left:auto;margin-right:0}
.blog-image-tools{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:12px 14px;border:1px solid var(--border);border-bottom:0;border-radius:12px 12px 0 0;background:var(--soft);color:var(--text)}
.blog-image-tools span{font-weight:700;font-size:12px;color:var(--accent)}
.blog-image-tools label{display:flex;align-items:center;gap:8px;flex:1;min-width:180px;font-size:12px}
.blog-image-tools input[type="range"]{flex:1;min-width:65px;max-width:200px;cursor:pointer}
.blog-image-tools output{min-width:38px;font-variant-numeric:tabular-nums}
.blog-image-tools button{border:1px solid var(--border);padding:7px 10px;border-radius:8px;background:var(--panel);color:var(--text)}
.blog-image-tools button:hover{background:var(--soft)}
.blog-image-tools:not([hidden])+.blog-content{border-top:1px solid var(--border)}
.blog-prose pre{position:relative;display:block;max-width:100%;white-space:pre;overflow:auto;border:1px solid var(--border);border-radius:12px;background:var(--bg);padding:42px 17px 18px;margin:22px 0;font:13px/1.75 ui-monospace,SFMono-Regular,Consolas,'Liberation Mono',monospace;tab-size:2}
.blog-prose pre::before{content:attr(data-language);position:absolute;top:10px;left:17px;font-family:inherit;font-size:11px;font-weight:700;letter-spacing:.3px;color:var(--accent);text-transform:uppercase}
.blog-prose pre code{display:block;background:transparent;white-space:pre;color:var(--text)}
.blog-prose .blog-copy-code{position:absolute;top:9px;right:12px;border:1px solid var(--border);border-radius:7px;background:var(--panel);font-size:11px;padding:5px 9px;color:var(--text)}
.blog-prose .blog-copy-code:hover{background:var(--soft);color:var(--accent)}
.blog-category-dialog{background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:16px;padding:22px;box-shadow:var(--shadow);width:min(95vw,510px);max-height:85vh;overflow:auto}
.blog-category-dialog::backdrop{background:rgba(0,0,0,.5)}
.blog-category-header{display:flex;justify-content:space-between;align-items:center;gap:12px}
.blog-category-header h3{margin:0;font-size:18px}
.blog-category-list{margin-top:19px;display:grid;gap:6px}
.blog-category-row{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--border);padding:10px 12px;border-radius:9px}
.blog-category-row>span{overflow-wrap:anywhere;font-weight:600}
.blog-category-row>div{display:flex;gap:6px;flex:none}
.blog-category-add{display:flex;gap:10px;margin-top:16px}
.blog-category-add input{border:1px solid var(--border);background:var(--panel);color:var(--text);border-radius:9px;padding:11px;min-width:0;flex:1}
.blog-category-add .primary{border-radius:9px;min-width:60px}
@media(max-width:700px){.blog-actions{top:65px}.blog-category-row{flex-wrap:wrap}.blog-category-row>div{margin-left:auto}.blog-image-tools label{flex:1 1 100%}.blog-filters .loginbutton{width:100%}}

/* Compact, single-line file location with a genuine parent-folder button. */
.file-location{display:flex;align-items:center;gap:7px;min-width:0;margin:8px 0 9px}
.file-location .file-breadcrumbs{flex:1;min-width:0;margin:0;padding:5px 7px;border-radius:9px;gap:3px;flex-wrap:nowrap;overflow-x:auto;white-space:nowrap;min-height:37px;box-shadow:none}
.file-location .file-breadcrumbs button{max-width:200px;padding:4px 7px;flex-shrink:0;white-space:nowrap}
.file-location .file-breadcrumbs span{flex-shrink:0;padding:0 3px}
.file-location .file-up{height:36px;min-width:38px;display:grid;place-items:center;font-size:19px;border:1px solid var(--border);border-radius:9px;background:var(--panel);color:var(--accent)}
.file-location .file-up:disabled{opacity:.4;cursor:not-allowed}
.sync-delete-action{color:#be4545!important}
.pcs-exclusion-section{margin-top:28px;border-top:1px solid var(--border);padding-top:19px}
.pcs-exclusion-title{display:flex;justify-content:space-between;align-items:center;gap:10px}
.pcs-exclusion-title h3{font-size:15px}.pcs-exclusions{display:grid;gap:8px}
.blog-toolbar{display:flex;gap:7px;align-items:center;flex-wrap:wrap;padding:10px}
.blog-tool-group{display:flex;align-items:center;flex-wrap:wrap;gap:4px;padding-right:9px;margin-right:2px;border-right:1px solid var(--border)}
.blog-tool-group:last-child{border-right:0}
.blog-toolbar button,.blog-toolbar select,.blog-color-picker{font-size:12px;min-height:34px}
.blog-toolbar select{padding:5px 7px;border:1px solid var(--border);border-radius:7px;background:var(--panel);color:var(--text)}
.blog-color-picker{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;padding:3px 5px;border:1px solid var(--border);border-radius:7px;background:var(--panel)}
.blog-color-picker input[type=color]{width:29px;height:26px;padding:1px;border:none;background:none;cursor:pointer}
.blog-prose table{border-collapse:collapse;width:100%;margin:16px 0;table-layout:fixed;font-size:14px}
.blog-prose td,.blog-prose th{border:1px solid var(--border);padding:9px 11px;min-width:30px;vertical-align:top;overflow-wrap:anywhere}
.blog-prose th{background:var(--soft);font-weight:700}
.blog-content td:focus,.blog-content th:focus{outline:1px solid var(--accent)}
.blog-prose a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
@media(max-width:680px){.blog-tool-group{border:0}.blog-toolbar button{padding:7px 8px}.file-location .file-breadcrumbs button{max-width:120px}}

/* Consistent workspace width across all major pages. */
:root{--heosebi-content-width:1200px}
main{max-width:none;min-width:0;width:auto}
main>header,main>#searchbar,main>.workspace,main>#linkPage,main>.page-panel,main>#filePage,main>footer{width:100%;max-width:var(--heosebi-content-width);margin-left:auto;margin-right:auto;min-width:0}
main>.workspace{max-width:var(--heosebi-content-width)}
main>.blog-page{max-width:var(--heosebi-content-width)}
/* Keep the editor toolbar and controls outside the scrolling document body. */
#blogEditor{min-width:0}
.blog-editor-shell{width:100%;max-width:100%;height:clamp(585px,calc(150dvh - 502.5px),1185px);min-height:585px;display:flex;flex-direction:column;border:1px solid var(--border);border-radius:12px;background:var(--panel);overflow:hidden;box-shadow:var(--shadow)}
.blog-editor-shell .blog-toolbar{flex:0 0 auto;display:flex;flex-wrap:nowrap;align-items:center;gap:5px;min-height:54px;max-height:67px;overflow-x:auto;overflow-y:hidden;border:0;border-bottom:1px solid var(--border);border-radius:0;padding:8px;background:var(--panel);overscroll-behavior-x:contain;scrollbar-width:thin}
.blog-editor-shell .blog-tool-group{flex:0 0 auto;flex-wrap:nowrap}
.blog-editor-shell .blog-image-tools:not([hidden]){flex:0 0 auto;max-height:110px;overflow:auto;border-bottom:1px solid var(--border)}
.blog-editor-shell .blog-content{flex:1 1 auto;min-height:0!important;max-height:none;overflow-y:auto;overscroll-behavior-y:contain;scrollbar-gutter:stable;outline:none;border:0!important;border-radius:0!important;box-shadow:none!important;padding:clamp(16px,3vw,35px)}
.blog-editor-shell .blog-content:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.blog-toolbar .blog-toggle-tool.is-active{background:var(--soft);border-color:var(--accent);color:var(--accent)}
.blog-highlight-color{flex:0 0 29px;width:29px!important;height:32px;padding:2px;border:1px solid var(--border);border-radius:7px;cursor:pointer}
.blog-context-menu:not([hidden]){position:fixed;z-index:2000;display:grid;gap:2px;min-width:170px;padding:5px;border:1px solid var(--border);background:var(--panel);box-shadow:0 14px 36px #0003;border-radius:10px}
.blog-context-menu button{display:block;padding:9px 12px;text-align:left;border-radius:7px;font-size:12px;color:var(--text)}
.blog-context-menu button:hover,.blog-context-menu button:focus-visible{background:var(--soft);color:var(--accent)}
@media(max-width:800px){main{padding-inline:18px}.blog-editor-shell{height:clamp(525px,calc(150dvh - 465px),1050px);min-height:525px}.blog-editor-shell .blog-toolbar{max-height:58px}.blog-editor-shell .blog-content{padding:18px}}
@media(max-width:520px){main{padding-inline:12px}.blog-editor-shell{height:clamp(510px,calc(150dvh - 450px),930px);min-height:510px}.blog-editor-shell .blog-toolbar{min-height:50px}.blog-toolbar button{white-space:nowrap}}

/* Blog ribbon: consistent compact menus, controls never scroll away with long articles. */
.blog-editor-shell .blog-toolbar{display:block;min-height:0;max-height:none;overflow:visible;padding:0;border-bottom:1px solid var(--border)}
.blog-toolbar-primary,.blog-toolbar-secondary{display:flex;align-items:center;gap:6px;min-width:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;padding:7px 10px}
.blog-toolbar-secondary{border-top:1px solid var(--border);background:var(--bg)}
.blog-toolbar-secondary[hidden]{display:none}
.blog-toolbar-primary>.blog-tool-group,.blog-toolbar-secondary>.blog-tool-group{flex:0 0 auto;display:flex;flex-wrap:nowrap}
.blog-toolbar .blog-extra-toggle{flex:0 0 auto;padding:7px 12px;border-radius:8px;border:1px solid var(--border);font-weight:600;background:var(--soft);color:var(--accent)}
.blog-toolbar .blog-extra-toggle.is-active{background:var(--accent);color:var(--panel)}
.blog-toolbar .blog-tool-group button{white-space:nowrap}
.blog-toolbar .blog-tool-group button:focus-visible,.blog-extra-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.blog-editor-shell .blog-content{position:relative}
/* Fixed image selection frame: the handles are deliberately outside the saved blog body. */
.blog-resize-overlay:not([hidden]){position:fixed;display:block;z-index:900;pointer-events:none}
.blog-resize-overlay .blog-resize-outline{position:absolute;inset:0;border:2px solid var(--accent);outline:1px solid var(--panel);pointer-events:none}
.blog-resize-overlay button{position:absolute;display:block;width:17px;height:17px;border-radius:5px;background:var(--panel);border:2px solid var(--accent);box-shadow:0 1px 5px #0003;pointer-events:auto;touch-action:none;padding:0}
.blog-resize-overlay button[data-resize-edge=nw]{top:-9px;left:-9px;cursor:nwse-resize}
.blog-resize-overlay button[data-resize-edge=ne]{top:-9px;right:-9px;cursor:nesw-resize}
.blog-resize-overlay button[data-resize-edge=sw]{bottom:-9px;left:-9px;cursor:nesw-resize}
.blog-resize-overlay button[data-resize-edge=se]{bottom:-9px;right:-9px;cursor:nwse-resize}
.blog-resize-overlay button:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.blog-content img.blog-image-selected{outline:none}
@media(max-width:800px){.blog-editor-shell .blog-toolbar{max-height:none}.blog-toolbar-primary,.blog-toolbar-secondary{padding:6px 8px}.blog-resize-overlay button{width:21px;height:21px}}
/* The workspace is the single width authority; no page sets its own narrower cap. */
main>.workspace>#dashboardPage,main>.workspace>#linkPage,main>.workspace>#blogPage,main>.workspace>#notePage,main>.workspace>#quickTransferPage,main>.workspace>#pcSyncPage,main>.workspace>#filePage{width:100%;max-width:none;margin-left:0;margin-right:0;min-width:0}
/* File storage follows the same sidebar/main geometry as all other pages. */


body[data-page="빠른 전송"] main>.workspace{max-width:var(--heosebi-content-width)}




/* Always-visible, contextual second row. No hidden "More" tools. */
.blog-editor-shell .blog-toolbar{display:flex;flex-direction:column;align-items:stretch;gap:0;flex-shrink:0;overflow:visible;padding:0;max-height:none}
.blog-toolbar-primary,.blog-toolbar-secondary{box-sizing:border-box;width:100%;min-height:46px;display:flex;align-items:center;gap:8px;overflow-x:auto;overflow-y:hidden;white-space:nowrap;scrollbar-width:thin;padding:6px 12px}
.blog-toolbar-secondary{background:var(--bg);border-top:1px solid var(--border);min-height:49px}
.blog-toolbar-secondary .blog-context-tools:not([hidden]){display:flex;align-items:center;gap:7px;width:max-content;min-width:100%;}
.blog-toolbar-secondary .blog-context-tools[hidden]{display:none!important}
.blog-toolbar-secondary .blog-tool-group{border-right:1px solid var(--border);padding-right:10px}
.blog-tool-caption{font-size:12px;font-weight:750;color:var(--accent);padding-right:12px;border-right:1px solid var(--border);flex-shrink:0}
.blog-context-tools>button,.blog-table-legacy>button,.blog-context-tools select{font-size:12px;min-height:32px;border:1px solid var(--border);border-radius:7px;color:var(--text);background:var(--panel);padding:6px 10px;cursor:pointer}
.blog-context-tools button:hover{background:var(--soft)}
.blog-context-tools label{display:inline-flex;align-items:center;gap:6px;font-size:12px;flex-shrink:0}
.blog-context-tools select{min-width:90px}
.blog-context-tools button.blog-tool-danger{color:#c23d3d}
.blog-context-tools .blog-tool-status{font-size:11px;color:var(--muted);padding-left:5px;flex-shrink:0}
.blog-table-legacy{display:inline-flex;align-items:center;gap:7px}
.blog-content .blog-cell-selected{outline:2px solid var(--accent);outline-offset:-2px;background:color-mix(in srgb,var(--accent) 10%,transparent)}
.blog-context-tools .blog-image-tools{padding:0;gap:8px;border:none;border-radius:0;background:transparent;max-height:none;flex-wrap:nowrap}
.blog-context-tools .blog-image-tools label{min-width:185px;flex:0 0 auto}
.blog-context-tools .blog-image-tools button{font-size:12px;min-height:32px}
.blog-prose pre[data-code-style="dark"]{background:#20242b;border-color:#3d4550;color:#edf0f4}
.blog-prose pre[data-code-style="dark"] code{color:#edf0f4}
.blog-prose pre[data-code-style="dark"]::before{color:#a9c5ff}
.blog-prose pre[data-code-style="light"]{background:#f5f7fb;border-color:#d7dfea;color:#202c41}
.blog-prose pre[data-code-style="light"] code{color:#202c41}
.blog-prose pre[data-code-style="minimal"]{background:transparent;border:0;border-left:3px solid var(--accent);border-radius:0;padding-top:32px;color:var(--text)}
.blog-prose pre[data-code-style="minimal"] code{color:var(--text)}
.blog-prose pre[data-wrap="true"],.blog-prose pre[data-wrap="true"] code{white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-width:700px){.blog-toolbar-primary,.blog-toolbar-secondary{padding:6px 8px}.blog-tool-caption{padding-right:8px}}

/* 2026-10-22 editor refinement: color favorites and drag-to-select tables */
.blog-color-group{gap:7px}
.blog-color-caption{font-size:12px;font-weight:700;color:var(--text)}
.blog-color-presets{display:flex;gap:4px;align-items:center}
.blog-toolbar .blog-color-swatch{width:22px;height:22px;min-height:22px;padding:0;border:1px solid var(--border);border-radius:6px;background:var(--swatch);box-shadow:inset 0 0 0 1px #00000010}
.blog-toolbar .blog-color-swatch.is-active{outline:2px solid var(--accent);outline-offset:2px}
.blog-toolbar .blog-color-swatch:hover{transform:scale(1.13)}
.blog-color-group #blogColorPin{padding:5px 7px;font-size:11px;min-height:28px}
.blog-content.blog-table-selecting,.blog-content.blog-table-selecting *{user-select:none!important;-webkit-user-select:none!important;cursor:crosshair!important}
.blog-content .blog-cell-selected{background:color-mix(in srgb,var(--accent) 21%,transparent);outline:2px solid var(--accent);outline-offset:-2px}

/* Document-editor style palette. Portaled to body so its grid is not clipped
   by the independently scrolling editor toolbar. */
.blog-toolbar .blog-color-trigger{display:inline-flex;align-items:center;gap:5px;justify-content:center;min-width:50px;padding:4px 8px!important}
.blog-color-trigger strong{font-family:serif;font-size:17px;line-height:18px;position:relative;padding-bottom:5px}
.blog-color-trigger .blog-color-underline{position:absolute;bottom:1px;left:9px;width:13px;height:3px;border-radius:2px;background:#111827}
.blog-color-popover:not([hidden]){position:fixed;display:flex;flex-direction:column;z-index:3000;width:230px;padding:8px 8px 5px;box-sizing:border-box;border:1px solid var(--border);border-radius:7px;background:var(--panel);box-shadow:0 9px 28px #0003}
.blog-color-presets{display:grid!important;grid-template-columns:repeat(12,1fr);gap:1px!important;align-items:stretch;width:100%}
.blog-color-popover .blog-color-swatch{appearance:none;display:block;width:100%;height:16px;min-height:16px;border-radius:0;border:1px solid transparent;padding:0;margin:0;background:var(--swatch,#fff);cursor:pointer;box-sizing:border-box}
.blog-color-popover .blog-color-swatch:hover,.blog-color-popover .blog-color-swatch.is-active{border-color:var(--text);outline:1px solid var(--panel);outline-offset:-3px;transform:none}
.blog-color-popover .blog-color-auto{font-size:15px;line-height:12px;background:linear-gradient(135deg,#fff 47%,#d92f42 49%,#d92f42 55%,#fff 57%);color:#141414}
.blog-color-popover .blog-color-more{font:inherit;font-size:12px;color:var(--text);border:0;border-top:1px solid var(--border);border-radius:0;background:transparent;cursor:pointer;text-align:center;margin-top:6px;padding:7px}
.blog-color-popover .blog-color-more:hover{color:var(--accent);background:var(--soft)}
.blog-color-popover #blogTextColor{position:absolute;width:0;height:0;opacity:0;pointer-events:none}
.blog-toolbar .blog-color-trigger{position:relative}
.blog-toolbar .blog-color-underline{bottom:4px;left:9px}

/* Rich article previews must preserve author paragraphs, separators and inline styles.
   Keep the card compact; a click opens the full-size article. */
.blog-card-body{display:flex;flex-direction:column;min-width:0}
.blog-card-preview{display:block;max-height:320px;overflow:hidden;min-width:0;
  color:var(--text);text-align:left;line-height:1.65;font-size:13px;
  overflow-wrap:anywhere;white-space:pre-wrap}
.blog-card-preview p,.blog-card-preview div,.blog-card-preview blockquote{margin:0 0 9px}
.blog-card-preview h2,.blog-card-preview h3,.blog-card-preview h4{margin:7px 0 6px;font-size:1.12em;line-height:1.4}
.blog-card-preview hr{height:0;border:0;border-top:1px solid var(--border);margin:10px 0}
.blog-card-preview blockquote{border-left:3px solid var(--accent);padding:5px 10px;background:var(--soft)}
.blog-card-preview ul,.blog-card-preview ol{padding-left:20px;margin:4px 0 10px}
.blog-card-preview img{display:block;height:auto!important;max-height:150px;max-width:100%;width:auto;margin:7px auto;object-fit:contain}
.blog-card-preview img[data-align="left"]{margin-left:0;margin-right:auto}
.blog-card-preview img[data-align="right"]{margin-right:0;margin-left:auto}
.blog-card-preview table{width:100%;border-collapse:collapse;table-layout:fixed;margin:7px 0}
.blog-card-preview td,.blog-card-preview th{border:1px solid var(--border);padding:3px 5px;font-size:11px;overflow-wrap:anywhere}
.blog-card-preview pre{margin:7px 0;padding:9px 10px;max-height:105px;overflow:hidden;
  white-space:pre-wrap;word-break:break-word;font:11px/1.5 ui-monospace,Consolas,monospace;
  background:var(--soft);border:1px solid var(--border);border-radius:7px}
.blog-card-preview pre::before{display:none}
.blog-card-preview .blog-card-link{text-decoration:underline;color:var(--accent)}
.blog-card-body .blog-card-preview span:not([style]):not(.blog-card-link){color:inherit}
.blog-card-body .blog-card-preview strong{font-size:inherit;color:inherit;font-weight:700}
.blog-card-body .blog-card-preview small{color:inherit}
.blog-card-preview>*:last-child{margin-bottom:0}



/* Blog cards: image covers stay in the article preview, not above the heading.
   The date/category and title begin at the same position on every card. */
.blog-card>.blog-card-body{flex:1;display:flex;flex-direction:column;width:100%;box-sizing:border-box}
.blog-card-heading{display:flex;flex-direction:column;gap:8px;min-width:0}
.blog-card-meta{display:block;line-height:1.5;overflow-wrap:anywhere}
.blog-card-title{display:block;line-height:1.35;overflow-wrap:anywhere}
.blog-card-preview{flex:0 1 auto;margin-top:4px}
.blog-card-preview img,
.blog-card-preview .blog-card-cover-fallback{display:block;max-width:100%;width:auto;height:auto!important;max-height:145px;object-fit:contain;border-radius:8px;margin:8px auto}
.blog-card-tags{display:block;min-height:0;margin-top:auto;padding-top:5px}

/* Sync PCs are virtual root folders. Ensure folder names are centered in icon mode. */
#filePage .file-items.icons .file-file-info{min-width:0;width:100%;display:flex;flex-direction:column;align-items:center;text-align:center}
#filePage .file-items.icons .file-folder-link,#filePage .file-items.icons .file-name-link{display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;white-space:normal;width:100%;max-width:100%;text-align:center!important;justify-content:center;overflow-wrap:anywhere}
#filePage .file-items.icons .file-meta{display:block;width:100%;text-align:center;white-space:normal;overflow-wrap:anywhere}
/* Narrow clickable breadcrumb targets without spaced-out pseudo cells. */
#filePage .file-location{gap:5px}
#filePage .file-location .file-breadcrumbs{flex:0 0 auto;max-width:calc(100% - 45px);width:auto;gap:0;padding:4px 7px;min-height:34px;min-width:0}
#filePage .file-location .file-breadcrumbs button{width:auto!important;max-width:190px;padding:4px 5px;flex:0 0 auto;min-width:0;margin:0}
#filePage .file-location .file-breadcrumbs span{padding:0 1px;margin:0 1px}
#filePage .file-location .file-up{height:34px;min-width:35px;font-size:16px;font-weight:800;line-height:1}
#filePage .file-parent-item .file-folder-link{font-size:17px;font-weight:750}
#filePage .file-parent-item .file-file-info{min-width:0}
#filePage .file-items.list .file-parent-item{background:var(--soft)}
#filePage .file-items.icons .file-parent-item{background:var(--soft)}
@media(max-width:680px){#filePage .file-location .file-breadcrumbs button{max-width:110px}}

/* 2026-10-23: Align blog reading and editing controls with the full-width workspace. */
#blogPage{width:100%;max-width:var(--heosebi-content-width,1200px);min-width:0}
#blogRead,#blogEditor{width:100%;min-width:0}
#blogRead .blog-top-actions,
#blogEditor .blog-actions{width:100%;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;box-sizing:border-box}
#blogRead .blog-top-actions{margin:18px 0 15px}
#blogRead .blog-reader-actions,#blogEditor .blog-editor-actions{display:flex;align-items:center;justify-content:flex-end;gap:9px;flex-wrap:wrap;margin:0;margin-left:auto}
#blogEditor .blog-actions{margin:18px 0 14px;padding:0 0 13px;border-radius:0;background:var(--bg)}
#blogRead .blog-article{width:100%;max-width:none;margin:0 0 24px;padding:clamp(18px,3vw,38px);min-width:0;box-sizing:border-box}
#blogRead .blog-article .blog-prose{max-width:100%;min-width:0}
#blogRead .blog-article h1{overflow-wrap:anywhere}
@media(max-width:600px){
  #blogRead .blog-top-actions,#blogEditor .blog-actions{gap:8px}
  #blogRead .blog-reader-actions,#blogEditor .blog-editor-actions{gap:6px}
  #blogRead .blog-top-actions button,#blogEditor .blog-actions button{padding:9px 10px;font-size:11px}
  #blogRead .blog-article{padding:18px 16px}
}

/* Administrator TOTP enrollment and login */
.twofa-settings{margin:20px 0;padding:20px;display:flex;flex-direction:column;gap:16px}
.twofa-heading{display:flex;align-items:start;justify-content:space-between;gap:15px;flex-wrap:wrap}
.twofa-heading h3{margin:0 0 6px}.twofa-heading p{margin:0;font-size:13px;color:var(--muted, #777);line-height:1.6}
.twofa-state{display:inline-flex;padding:5px 11px;border:1px solid var(--border);border-radius:100px;white-space:nowrap;font-size:12px}
.twofa-inline,.twofa-enroll{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.twofa-inline label,.twofa-enroll label{display:flex;flex-direction:column;gap:6px;width:min(100%,350px)}
.twofa-inline input,.twofa-enroll input{box-sizing:border-box;width:100%;min-width:0;padding:10px;border:1px solid var(--border);border-radius:9px;background:var(--surface,transparent);color:var(--text)}
.twofa-enroll p,#twofaEnabledPrompt p{margin:0;font-size:13px;line-height:1.7}
#twofaQR{border:1px solid var(--border);background:#fff;object-fit:contain;padding:8px;border-radius:12px;box-sizing:content-box}
.twofa-actions{display:flex;gap:8px;flex-wrap:wrap}
#loginTotpStage{margin:12px 0}#loginTotpStage p{font-size:13px;line-height:1.6}
#loginTotpStage label{display:block}#loginTotpStage input{width:100%;box-sizing:border-box}
#loginTotpBack{margin-top:10px}
.twofa-recovery-dialog{width:min(92vw,440px);box-sizing:border-box;padding:24px;border-radius:14px}
.twofa-recovery-dialog h2{margin:0 0 10px}.twofa-recovery-dialog p{line-height:1.65;font-size:13px}
#twofaRecoveryCodes{width:100%;box-sizing:border-box;resize:vertical;line-height:1.7;font-family:ui-monospace,monospace}
/* Do not let authored flex/display rules override the HTML hidden attribute. */
.twofa-settings [hidden],#loginDialog [hidden]{display:none!important}

/* Two-line excerpts make whole-article blog matches easy to identify in site search. */
.search-result-blog{display:grid;grid-template-columns:24px minmax(0,1fr);column-gap:13px;row-gap:3px;align-items:start}
.search-result-blog>span{grid-row:1 / span 2}
.search-result-blog strong{grid-column:2}
.search-result-blog small{grid-column:2;max-width:100%;min-width:0;white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;line-height:1.5}
.quick-item[data-quick-item]:focus{outline:2px solid var(--accent);outline-offset:3px}

/* Workspace hub & function-grouped settings · 2026-10-23 */
.dashboard-page{max-width:1180px}
.dash-welcome{display:flex;justify-content:space-between;align-items:center;gap:18px;margin:0 0 16px}
.dash-welcome h2{font-size:clamp(24px,3vw,31px);font-weight:770;letter-spacing:-.9px;margin:5px 0 8px}
.dash-welcome p,.settings-heading p{margin:0;color:var(--muted);font-size:12px;line-height:1.65}
.dash-kicker,.settings-heading .overline{color:var(--accent);font-size:10px;letter-spacing:1.8px;font-weight:750}
.dash-search-entry{width:100%;border:1px solid color-mix(in srgb,var(--accent) 28%,var(--border));border-radius:17px;background:var(--panel);padding:18px 20px;display:flex;align-items:center;gap:15px;text-align:left;color:var(--text);box-shadow:var(--shadow)}
.dash-search-entry:hover{border-color:var(--accent);background:color-mix(in srgb,var(--soft) 35%,var(--panel))}
.dash-search-symbol{font-size:27px;color:var(--accent);line-height:1}
.dash-search-entry>span:nth-child(2){display:flex;flex-direction:column;gap:5px;font-size:14px;font-weight:760;min-width:0}
.dash-search-entry small{font-size:11px;font-weight:400;color:var(--muted)}
.dash-search-entry kbd{font:11px ui-monospace,monospace;border:1px solid var(--border);background:var(--bg);border-radius:7px;padding:6px 8px;margin-left:auto;white-space:nowrap;color:var(--muted)}
.dash-section-label{display:flex;align-items:baseline;gap:11px;margin:25px 0 13px}
.dash-section-label h3{font-size:15px;font-weight:750;margin:0}.dash-section-label small{font-size:11px;color:var(--muted)}
.dash-launchers{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:11px}
.dash-launcher{min-width:0;background:var(--panel);border:1px solid var(--border);border-radius:15px;padding:18px 10px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:7px;color:var(--text)}
.dash-launcher:hover{background:var(--soft);border-color:var(--accent)}
.dash-launcher-icon{width:41px;height:41px;display:grid;place-items:center;border-radius:12px;color:var(--accent);background:var(--soft);font-size:23px}
.dash-launcher strong{font-size:12px;font-weight:750}.dash-launcher small{font-size:10px;color:var(--muted)}
.dash-overview-label{margin-top:27px}
.dashboard-page .dash-stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}
.dashboard-page .dash-stat{min-height:116px;padding:17px 18px;gap:7px;border-radius:14px}
.dashboard-page .dash-stat strong{font-size:26px;letter-spacing:-.6px}
.dashboard-page .dash-storage-overview{width:100%;margin-top:12px;border:1px solid var(--border);border-radius:13px;padding:13px 18px;background:var(--panel);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px 16px;text-align:left;color:var(--text);align-items:center}
.dash-storage-overview>span:first-child{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.dash-storage-overview>span:first-child strong{font-size:12px}.dash-storage-overview small{font-size:11px;color:var(--muted)}
.dash-storage-overview>strong{font-size:13px;color:var(--accent)}
.dash-storage-overview .dash-meter{grid-column:1/-1;height:6px;margin:0;background:var(--soft)}
.dash-activity-label{margin-top:28px}
.dashboard-page .dash-columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin-top:0}
.dashboard-page .dash-panel{min-height:180px;padding:18px;border-radius:15px}
.dash-blog-entry{display:flex;flex-direction:column;width:100%;gap:5px;text-align:left;padding:11px 1px;border:0;border-bottom:1px solid var(--border);background:transparent;color:var(--text)}
.dash-blog-entry:hover{color:var(--accent)}.dash-blog-entry:last-child{border-bottom:0}
.dash-blog-entry strong{font-size:12px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-width:100%}
.dash-blog-entry span{font-size:10px;color:var(--muted)}
.dash-widgets-empty{color:var(--muted);border:1px dashed var(--border);border-radius:12px;padding:22px;background:var(--panel);font-size:12px}
.settings-heading{margin-bottom:22px}.settings-heading .overline{margin-bottom:8px}
.settings-tabbar{display:flex;gap:8px;flex-wrap:wrap;padding:7px;background:var(--panel);border:1px solid var(--border);border-radius:14px;margin-bottom:20px}
.settings-tabbar button{min-width:0;flex:1 1 145px;text-align:center;border-radius:10px;padding:12px 13px;color:var(--muted);font-weight:650;font-size:12px;background:transparent;white-space:nowrap}
.settings-tabbar button[aria-selected="true"]{background:var(--soft);color:var(--accent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 15%,transparent)}
.settings-pane{width:100%;min-width:0;max-width:none}
.settings-group,.settings-pane>.twofa-settings{background:var(--panel);border:1px solid var(--border);border-radius:15px;margin:0 0 14px;padding:21px}
.settings-group-head{margin:0 0 18px}.settings-group-head h3{font-size:16px;margin:0 0 6px}.settings-group-head p{font-size:12px;line-height:1.7;color:var(--muted);margin:0}
.settings-option{display:flex;align-items:center;justify-content:space-between;gap:15px;border-top:1px solid var(--border);padding:16px 0}
.settings-option:last-child{padding-bottom:0}.settings-option>div{display:flex;flex-direction:column;gap:5px}.settings-option strong{font-size:13px}.settings-option small{color:var(--muted);font-size:11px}
.settings-option select{border:1px solid var(--border);background:var(--panel);color:var(--text);border-radius:9px;padding:9px 11px}
.settings-widget-switches{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.settings-widget-switches label{display:flex;align-items:center;gap:9px;background:var(--bg);border:1px solid var(--border);border-radius:9px;padding:13px;font-size:12px;cursor:pointer}
.settings-widget-switches input{accent-color:var(--accent)}
.settings-pane>.twofa-settings{margin-top:0!important}
.settings-pc-head{display:flex;justify-content:space-between;align-items:center;gap:15px;flex-wrap:wrap}
.settings-pane .pcs-summary{justify-content:space-between}
.settings-pane .pcs-summary button{margin-left:auto}
.settings-pc-foot{margin:17px 0}
.settings-details{border:1px solid var(--border);border-radius:12px;background:var(--panel);overflow:hidden;margin-top:12px}
.settings-details summary{cursor:pointer;padding:17px 20px;font-size:13px;font-weight:690;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:10px}
.settings-details summary::-webkit-details-marker{display:none}
.settings-details summary::after{content:'＋';color:var(--accent);font-size:16px}
.settings-details[open] summary::after{content:'−'}
.settings-details[open] summary{border-bottom:1px solid var(--border)}
.settings-details-body{padding:15px 20px 20px;font-size:12px;color:var(--muted);line-height:1.8}
.settings-details-body p{margin:6px 0}
.settings-details-body #pcSyncStoppedSources{margin-top:0;padding-top:0;border-top:0}
.settings-details-body .pcs-exclusion-title{flex-wrap:wrap}
.settings-details-body .pcs-exclusion-title p{max-width:680px}
.settings-warning{font-size:11px;color:var(--muted);line-height:1.7;margin:15px 3px}
@media(max-width:1040px){.dash-launchers{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.dashboard-page .dash-columns{grid-template-columns:1fr}.dashboard-page .dash-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.dash-launchers{grid-template-columns:repeat(3,minmax(0,1fr))}.dash-welcome h2{font-size:25px}.dash-section-label{margin-top:21px}.settings-tabbar button{flex:1 1 calc(50% - 8px)}}
@media(max-width:450px){.dash-search-entry{padding:15px 12px}.dash-search-entry kbd{display:none}.dash-search-entry small{font-size:10px}.dash-launcher{padding:13px 5px}.dash-launcher small{font-size:9px}.dash-launcher strong{font-size:11px}.dashboard-page .dash-stat{padding:13px}.settings-group{padding:16px}.settings-option{flex-wrap:wrap}.settings-option>div{flex:1 1 200px}.settings-widget-switches{grid-template-columns:1fr}}
/* Keep the dashboard refresh action compact on narrow screens. */
.dash-welcome>.loginbutton{flex:none;white-space:nowrap}

/* Consistent page labels/titles across every workspace page. */
.page-kicker{display:block;color:var(--accent);font-size:10px;font-weight:750;letter-spacing:1.8px;line-height:1.4;margin:0 0 7px;text-transform:uppercase}
.sectiontop.page-heading h2,.dash-welcome.page-heading h2{font-size:clamp(24px,2.5vw,30px);line-height:1.24;font-weight:770;letter-spacing:-.8px;margin:0}
.dash-welcome.page-heading{margin-bottom:22px}
.sectiontop.page-heading{align-items:center;min-height:65px;margin-bottom:20px}
.sectiontop.page-heading>div:first-child{min-width:0}
.settings-heading.page-heading{margin-bottom:20px}
.file-global-results:not([hidden]){display:grid;gap:6px;margin-bottom:13px;padding:14px;border:1px solid var(--border);border-radius:14px;background:var(--panel)}
.file-global-results .file-result-caption{color:var(--muted);font-size:12px;font-weight:650;padding:3px 4px 7px}
.file-global-results .file-result-row{display:grid;grid-template-columns:24px minmax(0,1fr);gap:10px;align-items:center;text-align:left;padding:10px 12px;border:1px solid var(--border);border-radius:9px;background:var(--bg);color:var(--text);width:100%}
.file-global-results .file-result-row:hover{border-color:var(--accent)}
.file-global-results .file-result-row strong{display:block;font-size:13px;overflow-wrap:anywhere}
.file-global-results .file-result-row small{display:block;font-size:11px;line-height:1.5;color:var(--muted);overflow-wrap:anywhere}
.file-global-results .file-result-empty{font-size:12px;color:var(--muted);padding:10px 5px}
@media(max-width:600px){.sectiontop.page-heading h2,.dash-welcome.page-heading h2{font-size:24px}}
.file-items[hidden]{display:none!important}
.file-global-results[hidden]{display:none!important}

/* Reserve vertical scrollbar width on all pages, preventing layout jumps when
   switching between short and long content on desktop. */
html{scrollbar-gutter:stable}


/* Blog image editing: keep full image within the editable page rather than clip/crop. */
#blogContent{min-width:0;max-width:100%;overflow-x:auto;overflow-y:auto}
#blogContent img{display:block;box-sizing:border-box;max-width:100%!important;height:auto!important;max-height:none!important;object-fit:contain}
#blogContent :is(figure,table,blockquote,pre){max-width:100%}
#blogContent figure{margin-inline:0}
#blogContent img.blog-image-selected{outline:none}
.blog-context-tools .blog-image-remove,.blog-image-tools .blog-image-remove{color:#bd4141;border-color:color-mix(in srgb,#bd4141 45%,var(--border));white-space:nowrap}
.blog-context-tools .blog-image-remove:hover,.blog-image-tools .blog-image-remove:hover{background:color-mix(in srgb,#bd4141 10%,var(--panel))}
#blogWideToggle{white-space:nowrap}
#blogWideToggle[aria-pressed="true"]{color:var(--accent);border-color:var(--accent);background:var(--soft)}
/* Only blog-edit mode grows. The published article and all other site pages stay unchanged. */
body[data-page="블로그"].blog-editor-expanded{--heosebi-content-width:1640px}
body[data-page="블로그"].blog-editor-expanded .blog-editor-shell{
  height:clamp(810px,calc(150dvh - 322.5px),1680px);min-height:810px;
}
body[data-page="블로그"].blog-editor-expanded #blogContent{padding:clamp(16px,2.2vw,38px)}
@media(max-width:800px){
  body[data-page="블로그"].blog-editor-expanded .blog-editor-shell{height:clamp(630px,calc(150dvh - 300px),1350px);min-height:630px}
}
@media(max-width:520px){
  #blogWideToggle{padding-inline:8px}
  .blog-context-tools .blog-image-remove{font-size:11px}
}

/* Explicit-save blog editor + object selection and clipboard controls */
.blog-unsaved{font-size:12px;color:var(--accent);align-self:center;white-space:nowrap}
.blog-leave-dialog{border:1px solid var(--border);border-radius:14px;background:var(--panel);color:var(--text);box-shadow:var(--shadow);padding:24px;max-width:min(470px,94vw)}
.blog-leave-dialog::backdrop{background:#0008}
.blog-leave-dialog h3{margin:0 0 10px;font-size:18px}.blog-leave-dialog p{font-size:13px;color:var(--muted)}
.blog-leave-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px}
.blog-object-tools:not([hidden]){display:flex;align-items:center;flex-wrap:wrap;gap:8px;border-bottom:1px solid var(--border);padding:8px 14px;background:var(--soft);font-size:12px}
.blog-object-tools button{border:1px solid var(--border);background:var(--panel);color:var(--text);padding:6px 10px;border-radius:7px}
.blog-object-tools span{font-size:11px;color:var(--muted)}
.blog-content .blog-block-selected{outline:2px solid var(--accent);outline-offset:3px}
.blog-content img{cursor:grab;user-select:none;-webkit-user-drag:element}
.blog-content img:active{cursor:grabbing}

/* Code editor: editable plain-text body without browser-induced PRE splitting. */
.blog-content pre > code[contenteditable]{display:block;min-height:1.7em;caret-color:currentColor;cursor:text;outline:none}


/* 2026-10-24: document-first blog editor; one vertical page scroll only. */
body[data-page="블로그"] #blogEditor .blog-actions{
  position:sticky;top:var(--blog-actions-top,75px);z-index:1002;
  margin:8px 0 14px;padding:10px 12px;background:var(--bg);
  border:1px solid var(--border);border-radius:12px;
  box-shadow:0 4px 12px #0000000a;
}
body[data-page="블로그"] #blogEditorShell,
body[data-page="블로그"].blog-editor-expanded #blogEditorShell{
  display:block;position:relative;height:auto!important;min-height:0!important;
  overflow:visible!important;border-radius:12px;
}
body[data-page="블로그"] #blogToolbar{
  position:sticky;top:var(--blog-toolbar-top,138px);z-index:1001;
  overflow:visible;border-radius:12px 12px 0 0;
  box-shadow:0 5px 15px #00000012;
  background:var(--panel);
}
body[data-page="블로그"] #blogToolbar .blog-toolbar-primary,
body[data-page="블로그"] #blogToolbar .blog-toolbar-secondary{
  min-height:44px;gap:6px;padding:6px 10px;
}
body[data-page="블로그"] #blogContent,
body[data-page="블로그"].blog-editor-expanded #blogContent{
  height:auto!important;min-height:clamp(620px,90dvh,1300px)!important;
  max-height:none!important;overflow-y:visible!important;overflow-x:visible!important;
  padding:clamp(16px,2.5vw,36px);
  scroll-margin-top:calc(var(--blog-toolbar-top,138px) + 110px);
}
body[data-page="블로그"] #blogContent:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
body[data-page="블로그"] #blogContent table{max-width:100%;overflow-wrap:anywhere}
body[data-page="블로그"] #blogContent pre{overflow-x:auto}
body[data-page="블로그"] main>header{z-index:1004}
body[data-page="블로그"] .blog-resize-overlay:not([hidden]){z-index:1000}
body[data-page="블로그"] .blog-object-tools:not([hidden]){
  position:fixed;z-index:1003;width:max-content;max-width:calc(100vw - 16px);
  border:1px solid var(--border);border-radius:10px;box-shadow:0 8px 30px #0003;
  padding:7px 9px;background:var(--panel);flex-wrap:wrap;
}
.blog-insert-popover:not([hidden]){
  position:fixed;z-index:3100;display:flex;flex-direction:column;gap:5px;
  width:max-content;min-width:165px;padding:8px;border:1px solid var(--border);
  background:var(--panel);color:var(--text);box-shadow:0 10px 28px #0003;border-radius:11px;
}
.blog-insert-popover>button{display:block;text-align:left;white-space:nowrap;
  padding:9px 12px;border:0;border-radius:7px;background:var(--panel);color:var(--text);font-size:12px;cursor:pointer}
.blog-insert-popover>button:hover,.blog-insert-popover>button:focus-visible{background:var(--soft);color:var(--accent)}
#blogInsertMore[aria-expanded="true"]{background:var(--soft);border-color:var(--accent);color:var(--accent)}
body[data-page="블로그"] #blogToolbar .blog-toolbar-secondary:has(#blogToolsText:not([hidden])){background:var(--bg)}
@media(max-width:800px){
  body[data-page="블로그"] #blogContent,body[data-page="블로그"].blog-editor-expanded #blogContent{min-height:clamp(510px,85dvh,950px)!important}
  body[data-page="블로그"] #blogEditor .blog-actions{flex-wrap:wrap}
  body[data-page="블로그"] .blog-object-tools:not([hidden]){font-size:11px}
}
@media(max-width:520px){
  body[data-page="블로그"] #blogToolbar .blog-toolbar-primary,
  body[data-page="블로그"] #blogToolbar .blog-toolbar-secondary{padding:6px 8px}
  body[data-page="블로그"] #blogContent{padding:16px}
}
/* Compact mobile writer: no sideways hunt for essential formatting/insert buttons. */
@media(max-width:520px){
 body[data-page="블로그"] #blogToolbar .blog-toolbar-primary{
  display:flex;flex-wrap:wrap;justify-content:flex-start;
  overflow-x:visible;overflow-y:visible;white-space:normal;gap:4px 6px;
 }
 body[data-page="블로그"] #blogToolbar .blog-toolbar-primary>.blog-tool-group{flex:0 0 auto;gap:4px}
 body[data-page="블로그"] #blogToolbar .blog-toolbar-primary button{padding:7px 8px}
 body[data-page="블로그"] #blogToolbar .blog-toolbar-primary select{max-width:112px}
}

/* Phase 2: edit-only article settings drawer and in-page heading outline. */
body[data-page="블로그"] #blogEditor .blog-editor-option{
 white-space:nowrap;min-height:34px;
}
body[data-page="블로그"] #blogEditor .blog-editor-option.is-active{
 color:var(--accent);border-color:var(--accent);background:var(--soft);
}
.blog-meta-summary{font-size:12px;line-height:1.6;color:var(--muted);padding:7px 2px 12px;overflow-wrap:anywhere}
.blog-settings-panel[hidden],.blog-toc-panel[hidden]{display:none!important}
.blog-settings-panel{padding:16px 18px;margin:0 0 16px;border:1px solid var(--border);border-radius:12px;background:var(--panel)}
.blog-settings-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap}
.blog-settings-head strong{font-size:14px}
.blog-settings-head span{font-size:12px;color:var(--muted)}
.blog-settings-panel .blog-fields{margin:12px 0 0;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.blog-settings-panel .blog-fields>input{flex:1;min-width:200px}
.blog-writing-layout{display:grid;grid-template-columns:minmax(0,1fr) 226px;align-items:start;gap:14px;width:100%}
.blog-writing-layout:not(.blog-toc-open){grid-template-columns:minmax(0,1fr)}
.blog-writing-main{min-width:0;max-width:100%}
.blog-toc-panel{position:sticky;top:calc(var(--blog-toolbar-top,138px) + 110px);max-height:calc(100dvh - var(--blog-toolbar-top,138px) - 130px);overflow-y:auto;overscroll-behavior:contain;min-width:0;
 border:1px solid var(--border);border-radius:12px;background:var(--panel);padding:13px 11px;box-shadow:0 3px 14px #0000000a}
.blog-toc-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 1px 7px}
.blog-toc-head strong{font-size:13px}
.blog-toc-head button{background:transparent;border:0;color:var(--muted);padding:3px 7px;cursor:pointer;border-radius:6px}
.blog-toc-head button:hover{background:var(--soft)}
.blog-toc-description{font-size:11px;line-height:1.5;color:var(--muted);margin:0 1px 9px}
.blog-toc-list{list-style:none;margin:0;padding:0;display:grid;gap:3px}
.blog-toc-link{width:100%;display:block;text-align:left;border:0;background:transparent;color:var(--text);border-radius:7px;padding:8px 8px;font-size:12px;line-height:1.55;overflow-wrap:anywhere;cursor:pointer}
.blog-toc-h3 .blog-toc-link{padding-left:20px;font-size:11px}
.blog-toc-h4 .blog-toc-link{padding-left:30px;font-size:11px;color:var(--muted)}
.blog-toc-link:hover,.blog-toc-link:focus-visible,.blog-toc-link[aria-current="location"]{background:var(--soft);color:var(--accent)}
.blog-toc-empty{font-size:12px;line-height:1.6;color:var(--muted);padding:10px 6px}
body[data-page="블로그"] #blogContent :is(h2,h3,h4){scroll-margin-top:calc(var(--blog-toolbar-top,138px) + 112px)}
@media(max-width:1099px){
 .blog-writing-layout,.blog-writing-layout.blog-toc-open{display:block}
 .blog-toc-panel:not([hidden]){position:fixed;z-index:1010;right:12px;top:calc(var(--blog-toolbar-top,138px) + 90px);bottom:12px;
   width:min(300px,calc(100vw - 24px));max-height:none;box-shadow:0 12px 45px #0004}
}
@media(max-width:640px){
 .blog-settings-panel{padding:12px}
 .blog-settings-panel .blog-fields{gap:7px}
 .blog-settings-panel .blog-fields>*{flex:1 1 100%;min-width:0!important;max-width:100%}
 .blog-meta-summary{font-size:11px}
 .blog-toc-panel:not([hidden]){top:calc(var(--blog-toolbar-top,138px) + 30px)}
}
/* Give the article more horizontal room when the desktop outline is open. */
@media(min-width:1100px){
  body[data-page="블로그"]:has(#blogEditor:not([hidden]) .blog-writing-layout.blog-toc-open):not(.blog-editor-expanded){
    --heosebi-content-width:1480px;
  }
}

/* Selected-text formatting: precise px and live formatting state. */
.blog-prose{font-size:16px}
.blog-prose h2{font-size:28px;line-height:1.42;font-weight:700;margin:1.35em 0 .7em}
.blog-prose h3{font-size:22px;line-height:1.5;font-weight:700;margin:1.2em 0 .65em}
.blog-prose h4{font-size:19px;line-height:1.5;font-weight:700}
.blog-prose p{font-size:inherit;line-height:inherit}
/* The dashboard h2>span badge selector must never resize article text. */
.blog-prose h2 > span{font-size:inherit}
/* A manually resized heading should use its new font metrics, not the large
   preset's generous heading spacing. Both editor and published post use this. */
.blog-prose :is(h2,h3)[style*="font-size"]{line-height:1.6;margin-block:.55em .4em}

.blog-toolbar .blog-font-size-control{display:inline-flex;align-items:center;gap:3px;
  color:var(--text);border:1px solid var(--border);background:var(--panel);border-radius:7px;
  padding:0 7px;height:34px;white-space:nowrap;box-sizing:border-box}
.blog-toolbar .blog-font-size-control input{width:48px;min-width:48px;height:28px;min-height:28px;
  margin:0;padding:2px 2px 2px 5px;border:0;box-shadow:none;background:transparent;
  color:inherit;font-weight:600;font-size:12px;line-height:1.3;text-align:right;outline:none;appearance:textfield;-moz-appearance:textfield}
.blog-toolbar .blog-font-size-control input:focus{box-shadow:0 2px var(--accent)}
.blog-toolbar .blog-font-size-control input::placeholder{font-size:11px;color:var(--muted)}
.blog-toolbar .blog-font-size-control span{font-size:12px;color:var(--muted)}
.blog-toolbar button[data-command].is-active{background:var(--soft);border-color:var(--accent);color:var(--accent)}
.blog-toolbar button[data-command][data-mixed="true"]{border-style:dashed}
@media(max-width:520px){body[data-page="블로그"] #blogToolbar .blog-font-size-control input{width:43px;min-width:43px}}

.blog-toolbar .blog-font-size-control input::-webkit-outer-spin-button,
.blog-toolbar .blog-font-size-control input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* 2026-10-25: choose font size from a native pixel dropdown. */
.blog-toolbar .blog-font-size-control select{
 min-width:76px;max-width:88px;height:32px;padding:4px 7px;background:transparent;
 color:var(--text);border:0;font-weight:600;font-size:13px;cursor:pointer;outline:none;
}
.blog-toolbar .blog-font-size-control select:focus-visible{outline:2px solid var(--accent);border-radius:5px}
/* Contextual text formatting shown beside dragged selections, just like images. */
.blog-text-tools:not([hidden]){
 position:fixed;z-index:1800;display:flex;align-items:center;gap:4px;max-width:calc(100vw - 16px);
 overflow-x:auto;padding:6px 8px;background:var(--panel);border:1px solid var(--border);
 border-radius:9px;box-shadow:0 9px 28px #0003;scrollbar-width:thin;
}
.blog-text-tools button,.blog-text-tools select{
 flex-shrink:0;min-height:30px;padding:4px 8px;border:1px solid var(--border);
 background:var(--panel);color:var(--text);border-radius:6px;font-size:12px;
}
.blog-text-tools button.is-active{background:var(--soft);border-color:var(--accent);color:var(--accent)}
.blog-text-tools button:hover{background:var(--soft)}
.blog-text-tools .blog-text-swatch{width:24px;min-width:24px;padding:0;background:var(--swatch)}
.blog-text-tools .blog-text-separator{border-left:1px solid var(--border);height:23px;margin-inline:2px}
.blog-context-menu .blog-menu-divider{height:1px;margin:4px 3px;background:var(--border)}
.blog-context-menu .blog-menu-title{font-size:11px;color:var(--muted);padding:6px 9px}
.blog-context-menu button{display:flex;justify-content:space-between;gap:16px;align-items:center}
.blog-context-menu button small{font-size:10px;color:var(--muted)}
.blog-context-menu .blog-emoji-row{display:grid;grid-template-columns:repeat(8,1fr);gap:2px;padding:5px}
.blog-context-menu .blog-emoji-row button{font-size:18px;justify-content:center;padding:6px 1px}
@media(max-width:550px){.blog-text-tools:not([hidden]){max-width:calc(100vw - 12px);gap:3px;padding:5px}}

/* The blog text highlighter uses safe inline background-color styles. */

.blog-context-tools input[type="color"]{width:32px;height:29px;border:1px solid var(--border);border-radius:6px;background:var(--panel);padding:2px;cursor:pointer}
.blog-prose table :is(td,th){border-color:var(--blog-line-color,var(--border));border-width:var(--blog-line-width,1px);border-style:var(--blog-line-style,solid)}
.blog-context-menu button:disabled{opacity:.36;cursor:not-allowed;color:var(--muted)}
.blog-context-menu button:disabled:hover{background:transparent;color:var(--muted)}
/* Default/dark code blocks share exactly the same palette, including legacy blocks. */
.blog-prose pre:not([data-code-style]),.blog-prose pre[data-code-style="dark"]{background:#20242b;border-color:#3d4550;color:#edf0f4}
.blog-prose pre:not([data-code-style]) code,.blog-prose pre[data-code-style="dark"] code{color:#edf0f4}
.blog-prose pre:not([data-code-style])::before,.blog-prose pre[data-code-style="dark"]::before{color:#a9c5ff}
/* Theme-aware custom pixel picker, not an OS-specific native option popup. */
.blog-toolbar .blog-font-menu-button{border:0;background:transparent;color:var(--text);font-weight:650;font-size:13px;padding:4px 7px;white-space:nowrap;min-width:76px}
.blog-font-menu:not([hidden]){position:fixed;z-index:2200;display:grid;gap:2px;padding:6px;min-width:100px;max-height:55vh;overflow:auto;background:var(--panel);border:1px solid var(--border);border-radius:9px;box-shadow:0 16px 40px #0004;color:var(--text)}
.blog-font-menu button{background:var(--panel);color:var(--text);border:0;border-radius:6px;padding:8px 14px;text-align:left;font-size:13px}
.blog-font-menu button:hover,.blog-font-menu button.is-active{background:var(--soft);color:var(--accent)}

/* Keep remaining OS-native choices (table options and floating text palette) readable in both themes. */
.blog-toolbar select,.blog-context-tools select,.blog-text-tools select{color-scheme:light;background:var(--panel);color:var(--text)}
body.dark .blog-toolbar select,body.dark .blog-context-tools select,body.dark .blog-text-tools select{color-scheme:dark}
.blog-toolbar select option,.blog-context-tools select option,.blog-text-tools select option{background:var(--panel);color:var(--text)}
/* Code is plaintext: readable fixed typography, no rich-text decorations. */
.blog-prose pre code,.blog-content pre code{font-family:ui-monospace,SFMono-Regular,Consolas,'Liberation Mono',monospace;font-style:normal;font-weight:400;text-decoration:none}
.blog-toolbar.blog-code-formatting-disabled [data-command]:disabled,
.blog-toolbar.blog-code-formatting-disabled #blogBlockFormat:disabled{opacity:.5;cursor:not-allowed}

.blog-prose col{display:table-column}
.blog-prose table :is(td,th){background-color:transparent}
.blog-prose table th{background-color:var(--soft)}
/* Inline cell styles take precedence over the table-wide border settings. */
.blog-prose table :is(td,th){border-color:var(--blog-line-color,var(--border));border-width:var(--blog-line-width,1px);border-style:var(--blog-line-style,solid)}
.blog-content table .blog-cell-selected{outline:2px solid var(--accent);outline-offset:-2px;box-shadow:inset 0 0 0 999px color-mix(in srgb,var(--accent) 12%,transparent)}
.blog-context-tools label{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.blog-context-tools #blogTableCellBg{width:28px;height:28px;padding:1px;border:1px solid var(--border);border-radius:6px;cursor:pointer}

/* Advanced table editor: only appears while editing a table. */
.he-table-extra{display:inline-flex;flex-wrap:wrap;gap:5px;align-items:center;border-left:1px solid var(--border);padding-left:8px}
.he-table-extra label{display:inline-flex;align-items:center;gap:4px}
#heTablePicker{position:fixed;z-index:2500;background:var(--panel);border:1px solid var(--border);box-shadow:0 12px 35px #0003;border-radius:12px;padding:12px;width:248px;max-width:calc(100vw - 16px)}
#heTablePicker strong{display:block;margin-bottom:8px}
.he-table-picker-grid{display:grid;grid-template-columns:repeat(10,1fr);gap:3px}
.he-table-picker-grid button{height:18px;min-width:0;padding:0;border:1px solid var(--border);border-radius:2px;background:var(--soft);cursor:pointer}
.he-table-picker-grid button.he-selected,.he-table-picker-grid button:hover{background:var(--accent);border-color:var(--accent)}
#heTablePicker small{display:block;color:var(--muted);margin:8px 0}
#heTablePicker #heTableCustom{width:100%}

/* ONE-inspired table interactions: isolated from saved post content. */
#heOneTableChrome{position:fixed;inset:0;z-index:1900;pointer-events:none;font-family:inherit;color:#333}
#heOneTableChrome[hidden]{display:none!important}
#heOneTableChrome button{font-family:inherit;cursor:pointer}
#heOneTableChrome .he-one-corner{position:fixed;width:14px;height:14px;padding:0;transform:translate(-35%,-35%);background:#03c75a;border:1px solid #02b04f;border-radius:1px;pointer-events:auto;clip-path:polygon(0 0,100% 0,0 100%)}
#heOneTableChrome .he-one-corner:hover{filter:brightness(.92)}
#heOneTableChrome .he-one-boundaries{position:fixed;inset:0;pointer-events:none}
#heOneTableChrome .he-one-boundary{position:fixed;pointer-events:auto;touch-action:none}
#heOneTableChrome .he-one-plus{width:13px;height:13px;min-width:13px;padding:0;transform:translate(-50%,-50%);border:1px solid #b7cfc0;border-radius:100px;background:#fff;color:#43a66f;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:500;line-height:11px;box-shadow:0 1px 1px #0001;opacity:.88}
#heOneTableChrome .he-one-plus:hover,#heOneTableChrome .he-one-plus:focus-visible{background:#03c75a;color:#fff;border-color:#03c75a;opacity:1;outline:0}
#heOneTableChrome .he-one-grip{padding:0;border:0;opacity:0;background:#03c75a;border-radius:0;transition:opacity .12s}
#heOneTableChrome .he-one-grip:hover,#heOneTableChrome .he-one-grip:focus-visible{opacity:.6}
#heOneTableChrome .he-one-col-grip{width:6px;transform:translateX(-50%);cursor:col-resize}
#heOneTableChrome .he-one-row-grip{height:6px;transform:translateY(-50%);cursor:row-resize}
#heOneTableChrome.he-one-resizing,#heOneTableChrome.he-one-resizing *{user-select:none!important}
#heOneTableChrome .he-one-menu{position:fixed;pointer-events:auto;display:flex;flex-direction:column;gap:0;width:104px;padding:5px 0;background:#fff;border:1px solid #ddd;box-shadow:0 2px 8px #0002;font-size:12px;z-index:2}
#heOneTableChrome .he-one-menu>button{width:100%;display:flex;align-items:center;gap:8px;text-align:left;border:0;border-radius:0;background:transparent;color:#333;font-size:12px;min-height:35px;padding:7px 10px;white-space:nowrap}
#heOneTableChrome .he-one-menu>button:hover:not(:disabled),#heOneTableChrome .he-one-delete button:hover{background:#edfbf3;color:#0d7a3a}
#heOneTableChrome .he-one-menu>button:disabled{opacity:.4;cursor:not-allowed}
#heOneTableChrome .he-one-menu>button[data-one-action="delete"]{border-top:1px solid #eee;margin-top:4px;padding-top:9px}
#heOneTableChrome .he-one-symbol{width:16px;text-align:center;font-size:15px;font-weight:400;color:#555;line-height:1}
#heOneTableChrome .he-one-down{margin-left:auto;color:#777}
#heOneTableChrome .he-one-delete:not([hidden]){position:absolute;right:100%;bottom:0;display:flex;flex-direction:column;min-width:122px;padding:5px 0;background:#fff;border:1px solid #ddd;box-shadow:0 3px 10px #0002;z-index:3}
#heOneTableChrome .he-one-delete button{text-align:left;padding:8px 12px;border:0;background:#fff;font-size:12px;color:#333;white-space:nowrap}
#blogContent table .blog-cell-selected{outline:1px solid #98dfb0!important;outline-offset:-1px!important;box-shadow:inset 0 0 0 999px rgba(3,199,90,.15)!important}
#blogContent.blog-table-selecting table .blog-cell-selected{box-shadow:inset 0 0 0 999px rgba(3,199,90,.23)!important}
@media(max-width:600px){#heOneTableChrome .he-one-menu{width:100px}#heOneTableChrome .he-one-menu>button{min-height:32px}#heOneTableChrome .he-one-col-grip,#heOneTableChrome .he-one-row-grip{display:none}}

/* Compact table toolbar. Structural commands live on the ONE table overlay;
   their hidden DOM buttons stay wired for keyboard and right-click actions. */
#blogTableHiddenActions[hidden]{display:none!important}
#blogToolsTable.blog-table-compact{min-width:0;gap:10px}
#blogTableStyleToggle{white-space:nowrap}
#blogTableStyleToggle[aria-expanded="true"]{background:var(--soft);color:var(--accent);border-color:var(--accent)}
#blogTableStatus:empty{display:none}
.blog-table-style-popover[hidden]{display:none!important}
.blog-table-style-popover:not([hidden]){
 position:fixed;z-index:3150;width:min(410px,calc(100vw - 16px));
 max-height:min(76dvh,660px);overflow-y:auto;overscroll-behavior:contain;
 padding:14px;background:var(--panel);color:var(--text);
 border:1px solid var(--border);border-radius:12px;
 box-shadow:0 14px 38px #0003;box-sizing:border-box;
}
.blog-table-style-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:9px}
.blog-table-style-head strong{font-size:14px}
.blog-table-style-head button{border:0;background:transparent;color:var(--muted);cursor:pointer;padding:5px 7px}
.blog-table-style-section{padding:10px 0;border-top:1px solid var(--border)}
.blog-table-style-section h3{font-size:12px;font-weight:700;color:var(--muted);margin:0 0 10px}
.blog-table-style-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:end;gap:9px}
.blog-table-style-fields label,.blog-table-style-popover .he-table-extra label{display:flex;flex-direction:column;align-items:stretch;gap:5px;font-size:12px;color:var(--text);min-width:0}
.blog-table-style-fields button,.blog-table-style-fields select,.blog-table-style-popover .he-table-extra button,.blog-table-style-popover .he-table-extra select{
 min-width:0;width:100%;box-sizing:border-box;min-height:32px;padding:5px 8px;
 border:1px solid var(--border);border-radius:7px;background:var(--panel);color:var(--text);font-size:12px;cursor:pointer;
}
.blog-table-style-fields input[type="color"]{width:100%;height:32px;border:1px solid var(--border);border-radius:7px;background:var(--panel);padding:3px;cursor:pointer}
#blogTableAdvanced{margin-top:9px}
#blogTableAdvanced .he-table-extra{
 display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;
 padding:0;border:0;margin:0;align-items:end;
}
#blogTableAdvanced .he-table-extra label{gap:5px}
.blog-table-style-fields button:hover,.blog-table-style-popover .he-table-extra button:hover{background:var(--soft)}
@media(max-width:480px){.blog-table-style-popover:not([hidden]){max-height:65dvh;padding:11px}}

/* Blog writer: concise line spacing and inline marker controls. */
#blogToolbar .blog-line-spacing-control{display:inline-flex;align-items:center}
#blogToolbar #blogLineSpacing{min-width:88px;max-width:102px;height:32px;padding:4px 5px;border:1px solid var(--border);border-radius:6px;font-size:12px;cursor:pointer}
#blogToolbar .blog-highlight-group{display:inline-flex;align-items:center}
#blogToolbar #blogHighlightButton{position:relative;display:inline-flex;align-items:center;gap:4px;height:33px;padding:5px 7px;font-size:12px}
.blog-highlight-icon{font-size:18px;line-height:1}
.blog-highlight-underline{display:block;width:16px;height:4px;background:#fff2a8;position:absolute;left:8px;bottom:2px;border-radius:1px}
.blog-highlight-popover[hidden]{display:none!important}
.blog-highlight-popover:not([hidden]){position:fixed;z-index:3300;display:grid;gap:10px;width:240px;max-width:calc(100vw - 18px);box-sizing:border-box;padding:12px;background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:10px;box-shadow:0 15px 36px #0003}
.blog-highlight-popover>strong{font-size:12px}
.blog-highlight-swatches{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.blog-highlight-swatch{height:26px;width:26px;cursor:pointer;border:1px solid var(--border);border-radius:5px}
.blog-highlight-swatch:hover,.blog-highlight-swatch:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.blog-highlight-actions{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px}
.blog-highlight-actions>button{font:inherit;border:1px solid var(--border);border-radius:5px;padding:6px 8px;cursor:pointer;background:var(--panel);color:var(--text)}
.blog-highlight-actions label{display:flex;align-items:center;gap:4px}
.blog-highlight-actions input[type="color"]{width:27px;height:26px;padding:1px;border:1px solid var(--border);border-radius:5px;cursor:pointer}


/* 2026-10-30: Chrome-inspired favicon shortcuts; only bookmarks UI is affected. */
#cards{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(112px,128px));
  justify-content:start;
  align-items:start;
  gap:12px 12px;
  margin:12px 0 28px;
}
#cards .card, #cards .favorite-add-tile{
  position:relative;
  min-width:0;
  width:100%;
  height:139px;
  min-height:0;
  border:1px solid transparent;
  background:transparent;
  border-radius:16px;
  box-shadow:none;
  transform:none;
  transition:background .13s ease,border-color .13s ease;
}
#cards .card:hover, #cards .card:focus-within,
#cards .favorite-add-tile:hover, #cards .favorite-add-tile:focus-visible{
  background:var(--soft);
  border-color:var(--border);
  transform:none;
}
#cards .card.group-colored{background:transparent;border-color:transparent}
#cards .card.group-colored:hover,#cards .card.group-colored:focus-within{
  background:color-mix(in srgb,var(--group-color) 12%,var(--panel));
  border-color:color-mix(in srgb,var(--group-color) 30%,var(--border));
}
#cards .card>a{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:12px;
  text-decoration:none;
  width:100%;
  height:100%;
  padding:21px 5px 13px;
  min-width:0;
  color:var(--text);
}
#cards .icon, #cards[data-size] .icon,
#cards .favorite-add-icon{
  display:grid;
  place-items:center;
  flex:none;
  margin:0;
  width:58px;
  height:58px;
  border-radius:50%;
  background:#e8ebf4;
  color:#3f5999;
  font-size:22px;
  font-weight:700;
}
#cards .card:nth-child(n) .icon{background:#e8ebf4;color:#3f5999}
#cards .card.group-colored:nth-child(n) .icon{
  background:color-mix(in srgb,var(--group-color) 24%,var(--panel));
  color:var(--text);
}
#cards .card strong,#cards[data-size] .card strong,
#cards .favorite-add-tile strong{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  line-clamp:2;
  overflow:hidden;
  overflow-wrap:anywhere;
  white-space:normal;
  text-overflow:ellipsis;
  color:var(--text);
  font-size:14px;
  line-height:1.4;
  text-align:center;
  font-weight:650;
  max-width:100%;
  margin:0;
}
#cards .card small,#cards .card-tags{display:none!important}
#cards .card .star,#cards .card .edit,#cards .card .card-grip{
  display:grid;
  place-items:center;
  position:absolute;
  top:4px;
  height:26px;
  width:26px;
  padding:0;
  font-size:15px;
  border-radius:9px;
  color:var(--muted);
  background:var(--panel);
  opacity:0;
  visibility:hidden;
  transition:opacity .13s ease;
  z-index:2;
}
#cards .card .star{left:3px;right:auto;color:#a5aab4}
#cards .card .star.on{color:#b58a3b}
#cards .card .edit{right:3px;left:auto;font-size:20px;line-height:1}
#cards .card .card-grip{
  top:auto;bottom:2px;right:3px;left:auto;
  cursor:grab;
  touch-action:none;
}
#cards .card:hover .star,#cards .card:hover .edit,#cards .card:hover .card-grip,
#cards .card:focus-within .star,#cards .card:focus-within .edit,#cards .card:focus-within .card-grip,
#cards .card .star:focus-visible,#cards .card .edit:focus-visible,#cards .card .card-grip:focus-visible{
  opacity:1;visibility:visible;
}
#cards .card .star:hover,#cards .card .edit:hover,#cards .card .card-grip:hover{
  background:var(--bg);color:var(--accent);
}
body:not(.authenticated) #cards .card .star,
body:not(.authenticated) #cards .card .edit,
body:not(.authenticated) #cards .card .card-grip{display:none!important}
#cards .favorite-add-tile{
  display:flex;flex-direction:column;align-items:center;gap:12px;
  padding:21px 5px 13px;cursor:pointer;color:var(--text);
}
#cards .favorite-add-icon{background:var(--soft);color:var(--accent);font-size:30px;font-weight:400}
.favicon-mark{position:relative;overflow:hidden}
.favicon-fallback{display:grid;place-items:center;width:100%;height:100%;line-height:1}
.favicon-img{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  display:block;width:32px;height:32px;max-width:66%;max-height:66%;
  object-fit:contain;opacity:0;transition:opacity .14s ease;
}
.favicon-img.is-ready{opacity:1}
body.dark #cards .card:nth-child(n) .icon{background:#323b4f;color:#c5d1fa}
body.dark #cards .card.group-colored:nth-child(n) .icon{background:color-mix(in srgb,var(--group-color) 22%,var(--panel));color:var(--text)}
#cards[data-size="large"]{grid-template-columns:repeat(auto-fill,minmax(132px,155px));gap:16px}
#cards[data-size="large"] .card,#cards[data-size="large"] .favorite-add-tile{height:167px}
#cards[data-size="large"] .card>a,#cards[data-size="large"] .favorite-add-tile{padding:23px 8px 14px;gap:14px}
#cards[data-size="large"] .icon,#cards[data-size="large"] .favorite-add-icon{width:76px;height:76px;font-size:27px}
#cards[data-size="large"] .favicon-img{width:43px;height:43px}
#cards[data-size="large"] .card strong,#cards[data-size="large"] .favorite-add-tile strong{font-size:15px}
#cards[data-size="small"]{grid-template-columns:repeat(auto-fill,minmax(92px,108px));gap:9px}
#cards[data-size="small"] .card,#cards[data-size="small"] .favorite-add-tile{height:117px}
#cards[data-size="small"] .card>a,#cards[data-size="small"] .favorite-add-tile{padding:15px 4px 11px;gap:9px}
#cards[data-size="small"] .icon,#cards[data-size="small"] .favorite-add-icon{width:47px;height:47px;font-size:18px}
#cards[data-size="small"] .favicon-img{width:27px;height:27px}
#cards[data-size="small"] .card strong,#cards[data-size="small"] .favorite-add-tile strong{font-size:12px}
#cards .card.favorite-dragging{opacity:.65;outline:2px solid var(--accent);background:var(--soft)}
#cards.favorite-sorting .card:not(.favorite-dragging){transition:none}
@media(hover:none){
  #cards .card .star,#cards .card .edit,#cards .card .card-grip{
    visibility:visible;opacity:.82;
    height:28px;width:28px;
  }
}
@media(max-width:520px){
  #cards{grid-template-columns:repeat(auto-fill,minmax(94px,1fr));gap:7px}
  #cards[data-size="large"]{grid-template-columns:repeat(auto-fill,minmax(118px,1fr))}
  #cards[data-size="small"]{grid-template-columns:repeat(auto-fill,minmax(84px,1fr))}
}
/* Recent shortcuts on the dashboard also display their real site favicons. */
.dash-link-icon.favicon-mark{border-radius:50%;background:var(--soft);width:40px;height:40px;flex:none}
.dash-link .favicon-img{width:24px;height:24px}
.dash-link.group-colored .dash-link-icon.favicon-mark{background:color-mix(in srgb,var(--group-color) 25%,var(--panel))}

/* Chrome-style bookmarks v2: local, user-positionable grid (no server-side slots). */
#cards{--favorite-cell:112px;--favorite-gap:12px;display:grid;grid-template-columns:repeat(var(--favorite-cols,8),minmax(0,var(--favorite-cell)));grid-auto-rows:120px;gap:var(--favorite-gap);justify-content:start;align-content:start;min-height:110px}
#cards[data-size="small"]{--favorite-cell:88px;--favorite-gap:8px;grid-template-columns:repeat(var(--favorite-cols,10),minmax(0,var(--favorite-cell)));grid-auto-rows:96px;gap:var(--favorite-gap)}
#cards .card{height:100%;width:100%;min-height:0;border:1px solid transparent;background:transparent;box-shadow:none;position:relative}
#cards .card>a{height:100%;padding:8px 4px 7px;gap:8px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}
#cards .card .icon,#cards[data-size] .card .icon{width:52px;height:52px;border-radius:50%;font-size:21px;background:#e9edf6;color:#405f9b;flex:none;margin:0}
#cards .card .favicon-img{width:32px;height:32px;max-width:75%;max-height:75%}
#cards .card strong,#cards[data-size] .card strong{font-size:13px;font-weight:580;line-height:1.4;max-width:100%;margin:0}
#cards[data-size="small"] .card{height:100%}
#cards[data-size="small"] .card>a{padding:7px 2px 5px;gap:6px}
#cards[data-size="small"] .card .icon{width:40px;height:40px;font-size:17px}
#cards[data-size="small"] .card .favicon-img{width:26px;height:26px}
#cards[data-size="small"] .card strong{font-size:11px;line-height:1.35}
#cards .card .star,#cards .favorite-add-tile{display:none!important}
#cards .card .card-grip{display:none}
#cards[data-arranging="true"] .card .card-grip{display:grid;opacity:1;visibility:visible;top:auto;bottom:0;right:3px;background:var(--panel);border:1px solid var(--border);cursor:grab;touch-action:none}
#cards .card .edit{top:2px;right:1px;left:auto}
#cards[data-arranging="true"] .card:hover{outline:1px solid var(--border)}
#cards .favorite-blank{width:100%;height:100%;min-width:0;min-height:0;padding:0;background:transparent;border:1px dashed color-mix(in srgb,var(--muted) 36%,transparent);border-radius:12px;opacity:.6}
#cards .favorite-blank:hover,#cards .favorite-blank:focus-visible,#cards .favorite-blank.favorite-drop-target{background:var(--soft);border-color:var(--accent);opacity:1}
#cards .card.favorite-drop-target{background:var(--soft);border:1px dashed var(--accent)}
#cards .card.favorite-dragging{opacity:.46;outline:2px solid var(--accent)}
.favorite-arrange-help{font-size:12px;color:var(--muted);padding:2px 0 14px;line-height:1.5}
.favorite-arrange-help button{font-size:12px;color:var(--accent);text-decoration:underline;margin-left:8px}
.favorites-toolbar{flex-wrap:wrap;gap:10px}
#favoriteArrange{font-size:12px;padding:8px 11px;white-space:nowrap}
#favoriteArrange[aria-pressed="true"]{background:var(--soft);color:var(--accent)}
@media(hover:none){#cards .card .star{display:none!important}#cards .card .edit{opacity:.85;visibility:visible}}
@media(max-width:520px){#cards{--favorite-cell:92px;--favorite-gap:7px;grid-auto-rows:114px}#cards[data-size="small"]{--favorite-cell:76px;--favorite-gap:6px;grid-auto-rows:93px}}

/* One-click row break to leave a variable number of icons on each row. */
#cards .card .favorite-break{display:none}
#cards[data-arranging="true"] .card .favorite-break{display:grid;place-items:center;position:absolute;bottom:0;left:3px;width:26px;height:26px;padding:0;z-index:2;border:1px solid var(--border);border-radius:8px;background:var(--panel);color:var(--muted);font-size:19px}
#cards[data-arranging="true"] .card .favorite-break:hover{color:var(--accent);background:var(--soft)}

/* v3: groups and selected favorites. One compact size, one browser-owned layout. */
#cards{--favorite-cell:88px;--favorite-gap:8px;grid-template-columns:repeat(var(--favorite-cols,10),minmax(0,var(--favorite-cell)));grid-auto-rows:96px;gap:var(--favorite-gap)}
#cards .card>a{padding:7px 2px 5px;gap:6px}
#cards .card .icon,#cards[data-size] .card .icon{width:40px;height:40px;font-size:17px}
#cards .card .favicon-img,#cards[data-size] .card .favicon-img{width:26px;height:26px}
#cards .card strong,#cards[data-size] .card strong{font-size:11px;line-height:1.35}
#cards .favicon-mark.has-icon .favicon-fallback,.dash-link .favicon-mark.has-icon .favicon-fallback{visibility:hidden}
#cards .card .favorite-toggle{position:absolute;left:2px;top:2px;width:24px;height:24px;z-index:3;display:grid;place-items:center;border-radius:7px;background:var(--panel);border:1px solid var(--border);color:var(--accent);font-size:16px;opacity:0;visibility:hidden}
#cards .card:hover .favorite-toggle,#cards .card:focus-within .favorite-toggle,#cards .card .favorite-toggle:focus-visible{opacity:1;visibility:visible}
#cards .card .favorite-toggle:hover{background:var(--soft)}
.bookmark-visible-check{display:flex;align-items:center;gap:8px}
#filters>button[data-filter="__favorites__"]{font-weight:700}
@media(hover:none){#cards .card .favorite-toggle{opacity:.9;visibility:visible}}
@media(max-width:520px){#cards{--favorite-cell:76px;--favorite-gap:6px;grid-auto-rows:93px}}

/* Inline group navigation: Favorites + all user-created groups in one row. */
.favorites-toolbar #filters{display:flex;flex:1 1 auto;min-width:0;align-items:center;gap:7px;flex-wrap:wrap;margin:0}
#filters>button[data-filter-tab="favorites"],#filters>button[data-filter-group]{font-size:12px;line-height:1.35;min-height:34px;padding:7px 12px;border:1px solid var(--border);border-radius:9px;white-space:nowrap}
#filters>button[data-filter-tab="favorites"]{font-weight:680;flex:none}
#filters>button[data-filter-tab="favorites"].active{background:var(--soft);color:var(--accent);border-color:var(--accent)}
#filters>button[data-filter-group]{background:var(--panel);color:var(--text);font-weight:580;flex:none}
#filters>button[data-filter-group].active{background:var(--soft);color:var(--accent);border-color:var(--accent)}
#filters>button[data-filter-group].group-colored{background:color-mix(in srgb,var(--group-color) 25%,var(--panel));border-color:color-mix(in srgb,var(--group-color) 45%,var(--border))}
#filters>button[data-filter-group].group-colored.active{background:color-mix(in srgb,var(--group-color) 42%,var(--panel));border-color:var(--group-color)}
#filters>button[data-filter-group][draggable="true"]{cursor:grab}
#filters>button[data-filter-group].filter-dragging{opacity:.4}
#filters>button[data-filter-group].drop-target{outline:2px solid var(--accent);outline-offset:2px}
@media(max-width:610px){.favorites-toolbar #filters{flex-basis:100%;gap:6px}}

/* PC sync read-only archive: folder contents can now be downloaded as ZIP. */
#filePage .sync-zip-download,#filePage .sync-current-zip{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;text-decoration:none;font-weight:650}
#filePage .sync-current-zip[hidden]{display:none!important}
#filePage .file-location{flex-wrap:wrap}
#filePage .sync-zip-download{font-size:12px}

/* Share selection actions and blog category tabs */
#fileSelectionActions [hidden]{display:none!important}
.blog-filters{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.blog-filters .blog-category-tabs{display:flex;gap:6px;align-items:center;flex:0 1 auto;max-width:100%;min-width:0;overflow-x:auto;scrollbar-width:thin;padding:2px 1px;white-space:nowrap}
.blog-category-tabs .blog-category-tab{width:auto;margin:0;text-align:center;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--border);border-radius:9px;background:var(--panel);color:var(--text);font:inherit;font-size:12px;line-height:1.3;padding:9px 13px;cursor:pointer;transition:background .15s,border-color .15s}
.blog-category-tabs .blog-category-tab:hover{background:var(--soft)}
.blog-category-tabs .blog-category-tab[aria-selected="true"]{color:var(--accent);border-color:var(--accent);background:var(--soft);font-weight:700}
.blog-filters #blogSearch{flex:0 1 240px;min-width:160px;max-width:100%}
.blog-filters #blogFilter[hidden]{display:none!important}
@media(max-width:720px){.blog-filters .blog-category-tabs{flex-basis:100%}.blog-filters #blogSearch{flex:1 1 160px}.blog-filters #blogManageCats{width:auto}}


/* 2026-10-30 rev3: two favorite tile sizes, each with its own browser-only slot map. */
.favorite-size-switch{display:inline-flex;flex:none;align-items:center;gap:2px;padding:3px;border:1px solid var(--border);background:var(--panel);border-radius:10px}
.favorite-size-switch button{padding:6px 11px;border-radius:7px;background:transparent;color:var(--muted);font-size:12px;white-space:nowrap;min-height:29px}
.favorite-size-switch button.selected,.favorite-size-switch button[aria-pressed="true"]{background:var(--soft);color:var(--accent);font-weight:700}
#cards[data-size="small"]{--favorite-cell:88px;--favorite-gap:8px;grid-template-columns:repeat(var(--favorite-cols,10),minmax(0,var(--favorite-cell)));grid-auto-rows:96px}
#cards[data-size="small"] .card>a{padding:7px 2px 5px;gap:6px}
#cards[data-size="small"] .card .icon{width:40px;height:40px;font-size:17px}
#cards[data-size="small"] .card .favicon-img{width:26px;height:26px}
#cards[data-size="small"] .card strong{font-size:11px;line-height:1.35}
#cards[data-size="large"]{--favorite-cell:116px;--favorite-gap:12px;grid-template-columns:repeat(var(--favorite-cols,8),minmax(0,var(--favorite-cell)));grid-auto-rows:130px}
#cards[data-size="large"] .card>a{padding:10px 4px 8px;gap:10px}
#cards[data-size="large"] .card .icon{width:58px;height:58px;font-size:24px}
#cards[data-size="large"] .card .favicon-img{width:36px;height:36px}
#cards[data-size="large"] .card strong{font-size:13px;line-height:1.4}
@media(max-width:520px){
 #cards[data-size="small"]{--favorite-cell:76px;--favorite-gap:6px;grid-auto-rows:93px}
 #cards[data-size="large"]{--favorite-cell:102px;--favorite-gap:8px;grid-auto-rows:124px}
}
/* File search: occupy all remaining width between selection count and fixed tools. */
#filePage .file-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:12px}
#filePage .file-toolbar .file-list-caption{flex:0 0 auto;min-width:max-content}
#filePage .file-toolbar .file-tools{display:flex;flex:1 1 620px;min-width:0;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px}
#filePage .file-toolbar .file-tools>.file-search-label{display:flex;flex:1 1 220px;min-width:175px;max-width:none;margin:0}
#filePage .file-toolbar .file-search-label input{flex:1 1 auto;width:100%;min-width:0;max-width:none;padding-right:8px}
#filePage .file-toolbar .file-tools>.file-sort,#filePage .file-toolbar .file-tools>.file-view-switch,#filePage .file-toolbar .file-tools>button{flex:0 0 auto;white-space:nowrap}
/* Blog: category buttons first; text search stretches into remaining room. */
.blog-filters{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.blog-filters .blog-category-tabs{flex:0 1 auto;max-width:65%;min-width:0}
.blog-filters #blogSearch{flex:1 1 220px;min-width:170px;max-width:none;width:auto}
.blog-filters #blogManageCats{flex:0 0 auto}
@media(max-width:760px){
  #filePage .file-toolbar .file-list-caption{width:100%}
  #filePage .file-toolbar .file-tools{width:100%;flex-basis:100%;justify-content:flex-start}
  #filePage .file-toolbar .file-tools>.file-search-label{flex-basis:100%;width:100%}
  .blog-filters .blog-category-tabs{max-width:100%;flex-basis:100%}
  .blog-filters #blogSearch{flex:1 1 170px}
}

/* Blog v1.2: page navigation shared by desktop browser and Android WebView. */
.blog-pagination:not([hidden]){display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:24px 0 10px;padding:12px 2px}
.blog-page-count{font-size:12px;color:var(--muted);white-space:nowrap}
.blog-page-buttons{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.blog-pagination .blog-page-buttons button{flex:0 0 auto;width:auto;min-width:36px;min-height:36px;padding:6px 10px;border:1px solid var(--border);background:var(--panel);border-radius:9px;color:var(--text);cursor:pointer;font-size:13px}
.blog-pagination .blog-page-buttons button[aria-current="page"]{background:var(--accent);color:white;border-color:var(--accent);font-weight:700}
.blog-pagination .blog-page-buttons button:disabled{opacity:.4;cursor:default}
.blog-page-ellipsis{padding:0 3px;color:var(--muted)}
@media(max-width:640px){.blog-pagination:not([hidden]){flex-direction:column;align-items:center}.blog-page-buttons{justify-content:center}.blog-pagination .blog-page-buttons button{min-width:35px;min-height:40px}}

/* rev7: mobile favorites are read-only shortcuts and never use the desktop size selector. */
@media(max-width:720px){
 #linkPage .group-actions,#linkPage .tag-filter-label,#linkPage .favorite-size-switch,
 #linkPage #favoriteArrange,#linkPage #favoriteArrangeHint,
 #linkPage #cards .edit,#linkPage #cards .favorite-toggle,
 #linkPage #cards .favorite-break,#linkPage #cards .card-grip,
 #linkPage #cards .favorite-blank{display:none!important}
 #linkPage #cards,#linkPage #cards[data-size]{--favorite-cell:76px;--favorite-gap:6px;grid-auto-rows:93px}
 #linkPage #cards .card .icon,#linkPage #cards[data-size] .card .icon{width:40px;height:40px;font-size:17px}
 #linkPage #cards .card .favicon-img,#linkPage #cards[data-size] .card .favicon-img{width:26px;height:26px}
 #linkPage #cards .card strong,#linkPage #cards[data-size] .card strong{font-size:11px}
}
/* rev7: smaller icons only, leave card, metadata, checkboxes and actions unchanged. */
#filePage .file-items.icons .file-type-icon{width:38px;height:38px;margin:2px auto 11px;border-radius:10px;font-size:11px}
#filePage .file-items.icons .file-type-icon.is-folder{font-size:19px}
#filePage .file-items.list .file-type-icon{width:34px;height:34px;border-radius:9px;font-size:10px}
#filePage .file-items.list .file-type-icon.is-folder{font-size:18px}

@media(max-width:720px){#linkPage #filters .filter-grip{display:none!important}}