:root{--bg:#f3f5f9;--panel:#fff;--text:#202b42;--muted:#79859a;--line:#e2e7ef;--blue:#3968ed;--soft:#edf2ff}body.dark{--bg:#111725;--panel:#1b2334;--text:#e4eafa;--muted:#9ca8bd;--line:#303c52;--soft:#26375a}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.65 system-ui,sans-serif}button,input,select,textarea{font:inherit;color:inherit}button,.button{border:1px solid var(--line);background:var(--panel);padding:9px 13px;border-radius:8px;cursor:pointer;text-decoration:none;display:inline-block}button:hover,.button:hover{border-color:var(--blue);color:var(--blue)}a{color:var(--blue)}input,textarea,select{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:11px;min-width:0}.primary{background:var(--blue);color:white;border-color:var(--blue)}header{height:76px;display:flex;gap:18px;align-items:center;padding:0 26px;background:var(--panel);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}.logo{font-size:21px;font-weight:800;letter-spacing:-1px;text-decoration:none;color:var(--text);white-space:nowrap}.logo span{color:var(--blue)}#search{flex:1;max-width:480px}#identity{margin-left:auto;font-size:12px}.layout{display:grid;grid-template-columns:220px minmax(0,1fr) 270px;max-width:1500px;margin:auto;min-height:calc(100vh - 76px)}nav{border-right:1px solid var(--line);padding:28px 18px}nav a{display:block;padding:12px;border-radius:8px;color:var(--text);text-decoration:none;margin-bottom:5px}nav a.active{background:var(--soft);color:var(--blue)}main{padding:30px;min-width:0}aside{padding:30px 20px 0 0}.card,.box{padding:24px;background:var(--panel);border:1px solid var(--line);border-radius:14px;margin-bottom:18px}.hero{padding:28px;background:linear-gradient(120deg,#2944a1,#4d7df7);color:white;border-radius:15px;margin-bottom:25px}.hero p{color:#dbe5ff;max-width:530px}.eyebrow{font-size:11px;letter-spacing:1.8px}.muted{color:var(--muted);font-size:12px}h1{font-size:28px;line-height:1.3;margin:0 0 12px}h2{font-size:22px;line-height:1.4;margin:12px 0}h3{font-size:16px;margin:0 0 12px}.title{text-decoration:none;color:var(--text)}.title:hover{color:var(--blue)}.pill{font-size:11px;color:var(--blue);background:var(--soft);padding:4px 8px;border-radius:6px;display:inline-block}.row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.between{justify-content:space-between}.actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:15px;margin-top:18px}.actions .end{margin-left:auto}.tags{font-size:12px;color:var(--muted)}.filters{margin:20px 0}.form label{display:block;margin:15px 0 5px;color:var(--muted);font-size:12px}.form input,.form textarea,.form select{width:100%}.form textarea{min-height:280px;resize:vertical}.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}.notice{padding:12px;background:var(--soft);border-left:3px solid var(--blue);border-radius:5px}.article{font-size:16px}.article h2{margin-top:30px;scroll-margin-top:100px}.article p{white-space:pre-wrap}.article pre{overflow:auto;background:var(--bg);padding:20px;border-radius:10px}.comment{border-top:1px solid var(--line);padding:16px 0}.comment p{white-space:pre-wrap}.comment-input{width:100%;min-height:90px}.error{color:#d64c62}.empty{padding:40px;text-align:center;color:var(--muted)}.login{max-width:440px;margin:50px auto}.login button{width:100%;margin-top:22px}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--text);color:var(--panel);padding:13px 24px;border-radius:10px;z-index:30}body.collapsed .layout{grid-template-columns:90px minmax(0,1fr) 270px}body.collapsed nav .label{display:none}.project-link{display:block;padding:12px 0;border-bottom:1px solid var(--line);text-decoration:none}table{width:100%;border-collapse:collapse;font-size:12px}td,th{padding:10px;text-align:left;border-bottom:1px solid var(--line)}.tablewrap{overflow:auto}body.guest .layout{display:block}body.guest nav,body.guest aside,body.guest #search,body.guest #logout{display:none}@media(max-width:1100px){.layout,body.collapsed .layout{grid-template-columns:190px minmax(0,1fr)}aside{display:none}}@media(max-width:720px){header{height:auto;min-height:70px;flex-wrap:wrap;padding:12px;gap:10px}#identity{font-size:10px}#search{order:2;max-width:none;flex-basis:100%}.layout,body.collapsed .layout{display:block}nav{display:flex;overflow:auto;padding:10px;border-bottom:1px solid var(--line)}nav a{white-space:nowrap;padding:8px}main{padding:18px}.two{grid-template-columns:1fr}.card{padding:20px}h1{font-size:25px}.logo{font-size:18px}}


/* ORTICON_ATTACHMENTS_V1 */
.attachment-box{overflow-wrap:anywhere}
.attachment-item{padding:14px 0;border-bottom:1px solid var(--line,#e5e9f1)}
.attachment-info{display:flex;flex-direction:column;gap:3px}
.attachment-name{font-weight:600;overflow-wrap:anywhere}
.attachment-buttons{display:flex;gap:8px;margin-top:9px;align-items:center}
.attachment-buttons .button,.attachment-buttons button{font-size:12px;padding:5px 9px}
.attachment-upload{display:block;margin-top:18px;padding:10px;text-align:center;border:1px dashed var(--blue,#3968ed);border-radius:9px;cursor:pointer;color:var(--blue,#3968ed)}
.attachment-upload input{display:block;width:100%;font-size:11px;margin-top:8px}
@media(max-width:1150px){.layout aside{display:block;grid-column:2;padding:0 24px 24px}.layout aside>.box:not(.attachment-box){display:none}}
@media(max-width:740px){.layout aside{padding:0 18px 18px}}

/* Единая кнопка прикрепления файлов без нативной панели */
.attachment-box .attachment-upload {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    min-height: 46px;
    margin: 16px 0 0;
    padding: 12px 16px;

    color: var(--blue, #3968ed);
    background: transparent;
    border: 1px dashed currentColor;
    border-radius: 10px;

    font: inherit;
    font-weight: 500;
    line-height: 1.4;
    text-align: center;

    cursor: pointer;
    transition: background-color 0.15s ease,
                box-shadow 0.15s ease;
}

.attachment-box .attachment-upload:hover {
    background: rgba(57, 104, 237, 0.06);
}

.attachment-box .attachment-upload:focus-within {
    background: rgba(57, 104, 237, 0.06);
    outline: 2px solid var(--blue, #3968ed);
    outline-offset: 3px;
}

/* Input остаётся доступным, но его системное оформление скрыто */
.attachment-box .attachment-upload input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    min-width: 0;
    min-height: 0;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
    background: transparent;
}

.attachment-box .attachment-upload:has(input:disabled) {
    opacity: 0.55;
    cursor: wait;
}



/* ORTICON_CLIENTS_V1 */
body.clients-mode .layout{grid-template-columns:220px minmax(0,1fr) 360px}
body.clients-mode.collapsed .layout{grid-template-columns:90px minmax(0,1fr) 360px}
.clients-panel{position:sticky;top:96px;max-height:calc(100vh - 120px);overflow:auto}
.client-tabs{margin-bottom:16px;gap:5px}.client-tabs button{font-size:11px;padding:6px 8px}
.clients-panel .form textarea{min-height:100px}
.client-checklist{padding:12px;border:1px solid var(--line);border-radius:9px;margin-top:10px;max-height:260px;overflow:auto}
.client-choice,.form label.client-choice{display:flex;align-items:center;gap:9px;margin:8px 0;color:var(--text);font-size:13px;cursor:pointer}
.form .client-choice input,.client-choice input{width:16px;min-width:16px;height:16px;padding:0;margin:0;accent-color:var(--blue)}
.client-link{border:0;padding:0;background:none;color:var(--blue);text-align:left}
@media(max-width:1150px){body.clients-mode .layout,body.clients-mode.collapsed .layout{grid-template-columns:190px minmax(0,1fr)}.layout aside>.box.clients-panel{display:block}.clients-panel{position:static;max-height:none}}
@media(max-width:740px){body.clients-mode .layout,body.clients-mode.collapsed .layout{display:block}}

/* Единая геометрия правой панели во всех разделах */
html {
    scrollbar-gutter: stable;
}

@media (min-width: 1151px) {
    body:not(.guest) .layout,
    body:not(.guest).clients-mode .layout {
        grid-template-columns: 220px minmax(0, 1fr) 360px;
    }

    body:not(.guest).collapsed .layout,
    body:not(.guest).clients-mode.collapsed .layout {
        grid-template-columns: 90px minmax(0, 1fr) 360px;
    }

    body:not(.guest) .layout > aside {
        display: block;
        grid-column: 3;
        grid-row: 1;
        align-self: start;

        position: sticky;
        top: 76px;
        height: calc(100vh - 76px);
        overflow-y: auto;
        overflow-x: hidden;
        scrollbar-gutter: stable;

        min-width: 0;
        padding: 30px 20px 20px 0;
    }

    /* Закрепляется весь aside, а не отдельная карточка */
    body:not(.guest) .layout > aside .clients-panel {
        position: static;
        max-height: none;
        overflow: visible;
    }

    body:not(.guest) .layout > aside > .box {
        box-sizing: border-box;
        width: 100%;
        min-width: 0;
    }
}

/* На узких экранах панель располагается под содержимым */
@media (min-width: 741px) and (max-width: 1150px) {
    body:not(.guest) .layout,
    body:not(.guest).collapsed .layout,
    body:not(.guest).clients-mode .layout,
    body:not(.guest).clients-mode.collapsed .layout {
        grid-template-columns: 190px minmax(0, 1fr);
    }

    body:not(.guest) .layout > aside {
        display: block;
        grid-column: 2;
        grid-row: auto;
        position: static;
        height: auto;
        padding: 0 30px 24px;
    }

    .clients-panel {
        position: static;
        max-height: none;
        overflow: visible;
    }
}

@media (max-width: 740px) {
    body:not(.guest) .layout,
    body:not(.guest).collapsed .layout,
    body:not(.guest).clients-mode .layout,
    body:not(.guest).clients-mode.collapsed .layout {
        display: block;
    }

    body:not(.guest) .layout > aside {
        display: block;
        position: static;
        height: auto;
        padding: 0 18px 18px;
    }

    .clients-panel {
        position: static;
        max-height: none;
        overflow: visible;
    }
}



/* ORTICON_USERS_EDIT_V1 */
.user-edit-panel{position:static;max-height:none;overflow:visible}
.user-edit-panel .form input,.user-edit-panel .form select{width:100%}
.user-edit-panel .form .client-choice input{width:16px;min-width:16px}
.user-edit-panel .client-checklist{max-height:200px}
.layout aside>.box.user-edit-panel{display:block}


/* ORTICON_AUDIENCE_TAGS_V1 */
.client-tag-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.client-tag-editor{margin:16px 0}
.client-tag-filters{display:grid;gap:10px;margin:0 0 20px;padding:16px;background:var(--panel);border:1px solid var(--line);border-radius:10px}
.client-tag-filters>label{font-size:12px;color:var(--muted)}
.client-tag-filters>select{width:100%;min-height:90px}
#post-audience-tag-box[hidden]{display:none}
