body {
    margin: 0;
    background: #f6f7f9;
    color: #1f2937;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    font-size: 15px;
}

.container {
    max-width: 960px;
    margin: 0 auto;
    padding: 16px;
}

.card {
    background: #fff;
    border-radius: 14px;
    padding: 16px;
    margin-bottom: 14px;
    box-shadow: 0 4px 14px rgba(0,0,0,0.04);
}

h1 { font-size: 22px; }
h2 { font-size: 18px; }
h3 { font-size: 16px; }

a {
    color: #1677ff;
    text-decoration: none;
}

button, .btn {
    display: block;
    width: 100%;
    background: #1677ff;
    color: #fff;
    border: none;
    border-radius: 12px;
    padding: 13px 16px;
    font-size: 16px;
    text-align: center;
    box-sizing: border-box;
}

.btn-light {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 0 16px;
    border: 1px solid #dbeafe;
    border-radius: 12px;
    background: #f8fbff;
    color: #2d7ff9;
    font-weight: 600;
    text-align: center;
    box-sizing: border-box;
}

.btn-danger,
button.btn-danger {
    background: #dc2626;
    color: #fff;
}

input, textarea, select {
    width: 100%;
    box-sizing: border-box;
    padding: 13px;
    border: 1px solid #dcdfe6;
    border-radius: 12px;
    margin-top: 6px;
    font-size: 16px;
    background: #fff;
}

textarea {
    min-height: 120px;
}

table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    font-size: 14px;
}

th, td {
    padding: 10px;
    border-bottom: 1px solid #eee;
    text-align: left;
}

.grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.photo {
    width: 30vw;
    height: 30vw;
    max-width: 120px;
    max-height: 120px;
    object-fit: cover;
    border-radius: 10px;
}

@media (min-width: 768px) {
    .container {
        padding: 24px;
    }

    button, .btn {
        width: auto;
        display: inline-block;
    }
}

/* User dashboard action buttons */
.dashboard-action-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-top: 18px;
}

.dashboard-action-list .dashboard-action-btn {
    width: 100%;
    box-sizing: border-box;
    margin: 0;
    text-align: center;
}

@media (min-width: 768px) {
    .dashboard-action-list {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .dashboard-action-list .dashboard-action-btn {
        width: auto;
        min-width: 160px;
    }
}

/* WeChat account register/login actions */
.wechat-account-actions {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #e5e7eb;
}

.wechat-account-tip {
    margin: 0 0 14px;
    color: #666;
    line-height: 1.7;
    text-align: center;
}

.wechat-account-action-list {
    display: flex;
    gap: 12px;
}

.wechat-account-action-list .wechat-account-action-btn {
    flex: 1;
    box-sizing: border-box;
    margin: 0;
    text-align: center;
}
/* ===========================
   User Dashboard V2
=========================== */

.user-dashboard-page{
    background:#f4f8fc;
}

.user-dashboard-container{
    max-width:900px;
    margin:auto;
    padding:20px;
}

.dashboard-profile-card{
    background:#ffffff;
    border-radius:16px;
    padding:24px;
    margin-bottom:18px;
    box-shadow:0 8px 24px rgba(0,0,0,.05);
}

.dashboard-eyebrow{
    color:#5aa8ff;
    font-size:12px;
    letter-spacing:2px;
    margin:0;
}

.dashboard-profile-title h1{
    margin:6px 0 18px;
    font-size:18px;
}

.project-document-list{
    display:grid;
    gap:12px;
}

.project-document-item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:14px 0;
    border-bottom:1px solid #e5e7eb;
}

.project-document-item:last-child{
    border-bottom:0;
}

.project-document-item p{
    margin:6px 0 0;
    color:#64748b;
    font-size:13px;
}

.project-document-actions{
    display:flex;
    align-items:center;
    gap:12px;
    flex-shrink:0;
}

.project-document-actions span{
    color:#64748b;
    font-size:13px;
}

.project-document-actions form{
    margin:0;
}

.project-document-delete{
    width:auto;
    margin:0;
    padding:6px 10px;
    border:1px solid #fecaca;
    background:#fff;
    color:#b91c1c;
}

.project-document-upload{
    padding-bottom:18px;
    margin-bottom:8px;
    border-bottom:1px solid #e5e7eb;
}

.project-document-upload-progress{
    height:8px;
    margin:10px 0 16px;
    overflow:hidden;
    border-radius:999px;
    background:#e5edf7;
}

.project-document-upload-progress > div{
    width:0;
    height:100%;
    border-radius:999px;
    background:#2d7ff9;
    transition:width .15s ease;
}

.project-document-actions small{
    color:#94a3b8;
    font-size:12px;
}

.project-document-download-help{
    margin:16px 0 0;
    padding:12px;
    border-radius:10px;
    background:#f8fafc;
    color:#64748b;
    font-size:13px;
    line-height:1.6;
}

.document-viewer-page{
    height:100vh;
    margin:0;
    overflow:hidden;
    background:#e9edf2;
}

.simple-pdf-viewer{
    box-sizing:border-box;
    height:100vh;
    padding:8px;
    overflow:auto;
    text-align:center;
    -webkit-overflow-scrolling:touch;
}

.continuous-pdf-pages{
    display:grid;
    gap:8px;
}

.continuous-pdf-page{
    display:flex;
    min-height:70vh;
    align-items:flex-start;
    justify-content:center;
    background:#fff;
    box-shadow:0 2px 12px rgba(15,23,42,.14);
}

.continuous-pdf-page canvas{
    display:block;
    max-width:100%;
    margin:0 auto;
    background:#fff;
}

.simple-pdf-loading{
    position:fixed;
    z-index:2;
    top:50%;
    left:50%;
    padding:9px 14px;
    border-radius:999px;
    background:rgba(15,23,42,.78);
    color:#fff;
    font-size:13px;
    transform:translate(-50%,-50%);
}

.simple-pdf-loading[hidden]{
    display:none;
}

.todo-assignee-list{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
    margin-top:8px;
}

.workspace-form .todo-assignee-list label{
    display:flex;
    align-items:center;
    gap:8px;
    min-height:42px;
    padding:8px 10px;
    border:1px solid #dbe3ec;
    border-radius:6px;
}

.todo-assignee-list input[type="checkbox"]{
    width:18px;
    height:18px;
    margin:0;
    flex:0 0 auto;
}

.todo-assignee-list span{
    display:block;
    min-width:0;
    line-height:18px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.workspace-form-field{
    margin:0 0 16px;
}

.todo-assignee-heading{
    margin-bottom:0;
}

.todo-detail-status{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:10px 12px;
    margin-bottom:14px;
    border:1px solid #dbe3ec;
    border-radius:6px;
    background:#f8fafc;
}

.todo-detail-status span,
.todo-detail-meta span{
    color:#64748b;
}

.todo-detail-block{
    padding:16px;
    margin-top:12px;
    border:1px solid #dbe3ec;
    border-radius:6px;
    background:#fff;
}

.todo-detail-block h3{
    margin:0 0 14px;
    font-size:16px;
}

.todo-detail-meta{
    display:grid;
    gap:8px;
    padding-top:12px;
    margin-top:14px;
    border-top:1px solid #e5e7eb;
}

.todo-detail-meta p{
    display:grid;
    grid-template-columns:76px minmax(0,1fr);
    align-items:start;
    gap:10px;
    margin:0;
}

.todo-detail-meta b{
    font-weight:500;
    overflow-wrap:anywhere;
}

.todo-detail-content{
    margin:0;
    line-height:1.75;
    white-space:pre-wrap;
}

.todo-detail-images{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:16px 0;
}

.todo-detail-images a{
    display:block;
    aspect-ratio:4/3;
    overflow:hidden;
    border:1px solid #e5e7eb;
    border-radius:6px;
}

.todo-detail-images img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.todo-feedback-form,
.activity-feedback-header{
    margin-top:20px;
}

.password-access-button{
    width:auto;
    min-height:30px;
    margin:0;
    padding:4px 10px;
    font-size:13px;
}

@media (max-width:600px){
    .project-document-item{
        align-items:flex-start;
        flex-direction:column;
    }

    .todo-assignee-list{
        grid-template-columns:1fr;
    }

    .todo-detail-images{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

.dashboard-section{
    background:#fff;
    border-radius:16px;
    padding:20px;
    margin-bottom:18px;
    box-shadow:0 6px 20px rgba(0,0,0,.05);
}

.dashboard-section-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:18px;
}

.dashboard-section-kicker{
    color:#5aa8ff;
    font-size:11px;
    letter-spacing:2px;
    margin:0;
}

.dashboard-section-header h2{
    margin:4px 0 0;
}

.dashboard-count{
    width:34px;
    height:34px;
    border-radius:17px;
    background:#eef6ff;
    color:#2d7ff9;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:bold;
}

.dashboard-project-card,
.dashboard-todo-card{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:16px;
    margin-bottom:12px;
    border:1px solid #edf2f7;
    border-radius:12px;
    text-decoration:none;
    color:#222;
    transition:.2s;
    background:#fff;
}

.dashboard-project-card:hover,
.dashboard-todo-card:hover{
    transform:translateY(-2px);
    box-shadow:0 8px 20px rgba(0,0,0,.08);
}

.dashboard-project-main h3{
    margin:0 0 8px;
}

.dashboard-project-meta{
    color:#666;
    margin:4px 0;
}

.dashboard-project-progress{
    text-align:right;
}

.dashboard-project-progress span{
    display:block;
    font-size:22px;
    color:#2d7ff9;
    font-weight:bold;
}

.dashboard-project-progress small{
    color:#888;
}

.dashboard-todo-title{
    font-weight:bold;
    margin-bottom:6px;
}

.dashboard-todo-project{
    color:#666;
    margin:4px 0;
}

.dashboard-todo-status{
    display:inline-block;
    padding:3px 10px;
    border-radius:20px;
    background:#eef6ff;
    color:#2d7ff9;
    font-size:13px;
}

.dashboard-secondary-actions{
    text-align:center;
    margin:30px 0;
    color:#999;
}

.dashboard-secondary-label{
    display:block;
    margin-bottom:10px;
    font-size:13px;
    color:#aaa;
}

.dashboard-secondary-actions a{
    color:#5a7cff;
    text-decoration:none;
    margin:0 10px;
}
/* User Dashboard V2.5 refinement */

.dashboard-profile-card h1,
.dashboard-section-header h2{
    margin:0;
}

.dashboard-profile-card p{
    margin:8px 0 0;
    color:#64748b;
}

.dashboard-project-card:last-child,
.dashboard-todo-card:last-child{
    margin-bottom:0;
}

.dashboard-todo-card{
    position:relative;
    display:block;
    padding-right:92px;
}

.dashboard-todo-title{
    color:#172033;
    font-size:17px;
    line-height:1.45;
}

.dashboard-todo-project{
    color:#64748b;
    font-size:14px;
}

.dashboard-todo-card > p{
    color:#64748b;
    line-height:1.55;
}

.dashboard-todo-status{
    position:absolute;
    top:50%;
    right:16px;
    transform:translateY(-50%);
    min-width:58px;
    box-sizing:border-box;
    text-align:center;
}

.dashboard-operation-section{
    margin-bottom:28px;
}

.dashboard-secondary-actions{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:18px;
    margin:0;
    padding:6px 0 4px;
}

.dashboard-secondary-actions a{
    display:inline-flex;
    justify-content:center;
    align-items:center;
    min-height:42px;
    margin:0;
    padding:0 18px;
    border:1px solid #dbeafe;
    border-radius:12px;
    background:#f8fbff;
    color:#2d7ff9;
    font-weight:600;
}

.dashboard-secondary-actions span{
    display:none;
}

@media (max-width:600px){
    .user-dashboard-container{
        padding:14px;
    }

    .dashboard-profile-card,
    .dashboard-section{
        padding:18px;
        border-radius:18px;
    }

    .dashboard-project-card{
        padding:16px;
    }

    .dashboard-project-main{
        min-width:0;
        padding-right:12px;
    }

    .dashboard-project-main h3{
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    .dashboard-project-progress{
        flex:0 0 auto;
    }

    .dashboard-todo-card{
        padding:16px 82px 16px 16px;
    }

    .dashboard-secondary-actions{
        gap:10px;
    }

    .dashboard-secondary-actions a{
        flex:1;
        padding:0 10px;
    }
}
/* Align dashboard sections consistently */

.user-dashboard-container > .dashboard-section,
.user-dashboard-container > .dashboard-profile-card{
    margin-left:0;
    margin-right:0;
    width:auto;
    box-sizing:border-box;
}

@media (max-width:600px){
    .user-dashboard-container{
        padding-left:14px;
        padding-right:14px;
    }

    .user-dashboard-container > .dashboard-section,
    .user-dashboard-container > .dashboard-profile-card{
        width:100%;
        margin-left:0;
        margin-right:0;
    }
}
/* ===========================
   Project Workspace V2.5
=========================== */

.project-workspace-page{
    background:#f4f7fb;
}

.project-workspace-container{
    max-width:900px;
    margin:0 auto;
    padding:16px;
}

.project-workspace-container > .card{
    margin-bottom:16px;
    padding:20px;
    border-radius:18px;
    background:#fff;
    box-shadow:0 8px 24px rgba(15,23,42,.05);
}

.project-workspace-container h1{
    margin:0 0 20px;
    font-size:26px;
    color:#172033;
}

.project-workspace-container h2{
    margin:0;
    font-size:21px;
    color:#172033;
}

.workspace-hero-header{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
    margin-bottom:16px;
}

.workspace-hero-header h1{
    margin-bottom:8px;
}

.workspace-hero-header p{
    margin:0;
    color:#64748b;
}

.workspace-hero-header > a{
    flex:0 0 auto;
    color:#2d7ff9;
    font-size:14px;
    text-decoration:none;
}

.project-workspace-container .card > p{
    margin:12px 0;
    color:#334155;
    line-height:1.6;
}

.workspace-meta-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:10px;
}

.workspace-meta-grid p{
    margin:0;
    padding:12px;
    border-radius:12px;
    background:#f8fbff;
    color:#334155;
    line-height:1.55;
}

.workspace-meta-grid b{
    display:block;
    margin-bottom:4px;
    color:#64748b;
    font-size:13px;
}

.workspace-progress-row{
    display:flex;
    justify-content:space-between;
    gap:12px;
    margin-top:18px;
    color:#64748b;
}

.workspace-progress-row strong{
    color:#172033;
}

.workspace-progress{
    width:100%;
    height:8px;
    margin:18px 0;
    overflow:hidden;
    border-radius:999px;
    background:#eaf1f8;
}

.workspace-progress > div{
    height:100%;
    min-width:0;
    border-radius:999px;
    background:#2d7ff9;
}

.progress-slider-field{
    margin:0 0 20px;
}

.progress-slider-heading{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:12px;
}

.progress-slider-heading label{
    margin:0;
}

.progress-slider-heading output{
    min-width:64px;
    padding:5px 12px;
    border-radius:999px;
    background:#eaf3ff;
    color:#1769d2;
    font-size:16px;
    font-weight:700;
    text-align:center;
}

.progress-slider-field input[type="range"]{
    width:100%;
    height:28px;
    min-height:0;
    margin:0;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    cursor:pointer;
    accent-color:#2d7ff9;
    -webkit-appearance:none;
    appearance:none;
}

.progress-slider-field input[type="range"]::-webkit-slider-runnable-track{
    height:8px;
    border-radius:999px;
    background:linear-gradient(
        90deg,
        #2d7ff9 0,
        #2d7ff9 var(--range-progress, 0%),
        #dbe7f5 var(--range-progress, 0%),
        #dbe7f5 100%
    );
}

.progress-slider-field input[type="range"]::-webkit-slider-thumb{
    width:24px;
    height:24px;
    margin-top:-8px;
    border:3px solid #fff;
    border-radius:50%;
    background:#2d7ff9;
    box-shadow:0 2px 8px rgba(45,127,249,.38);
    -webkit-appearance:none;
    appearance:none;
}

.progress-slider-field input[type="range"]::-moz-range-track{
    height:8px;
    border-radius:999px;
    background:#dbe7f5;
}

.progress-slider-field input[type="range"]::-moz-range-progress{
    height:8px;
    border-radius:999px;
    background:#2d7ff9;
}

.progress-slider-field input[type="range"]::-moz-range-thumb{
    width:20px;
    height:20px;
    border:3px solid #fff;
    border-radius:50%;
    background:#2d7ff9;
    box-shadow:0 2px 8px rgba(45,127,249,.38);
}

.progress-slider-field input[type="range"]:focus-visible{
    outline:3px solid rgba(45,127,249,.22);
    outline-offset:4px;
}

.progress-slider-scale{
    display:flex;
    justify-content:space-between;
    margin-top:2px;
    color:#94a3b8;
    font-size:12px;
}

.reminder-role-fieldset{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin:0 0 20px;
    padding:0;
    border:0;
}

.reminder-role-fieldset legend{
    width:100%;
    margin-bottom:8px;
    color:#334155;
    font-size:14px;
    font-weight:600;
}

.reminder-role-fieldset label{
    display:inline-flex;
    align-items:center;
    gap:7px;
    margin:0;
    padding:9px 12px;
    border:1px solid #dbe7f5;
    border-radius:10px;
    background:#f8fbff;
    color:#334155;
    cursor:pointer;
}

.reminder-role-fieldset label[hidden]{
    display:none;
}

.reminder-role-fieldset input{
    width:17px;
    height:17px;
    margin:0;
}

.reminder-setting-list{
    display:grid;
    gap:12px;
}

.reminder-setting-item{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    padding:16px;
    border:1px solid #e5edf7;
    border-radius:14px;
    background:#fbfdff;
}

.reminder-setting-item.is-disabled{
    opacity:.58;
}

.reminder-setting-item p{
    margin:6px 0 0;
    color:#475569;
}

.reminder-setting-item small{
    display:block;
    margin-top:8px;
    color:#94a3b8;
    line-height:1.5;
}

.reminder-setting-actions{
    display:flex;
    flex:0 0 auto;
    gap:12px;
}

.reminder-setting-actions form{
    margin:0;
}

.reminder-setting-actions button{
    width:auto;
    min-height:0;
    padding:0;
    border:0;
    background:transparent;
    color:#2d7ff9;
    font-size:13px;
}

.reminder-setting-actions .danger-link-button{
    color:#dc2626;
}

@media (max-width:560px){
    .reminder-setting-item{
        display:block;
    }

    .reminder-setting-actions{
        margin-top:12px;
    }
}

.workspace-document-links{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin-top:18px;
}

.workspace-document-links a{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:48px;
    border:1px solid #dbeafe;
    border-radius:12px;
    background:#f8fbff;
    color:#2d7ff9;
    font-weight:600;
    text-decoration:none;
}

.workspace-section-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:16px;
}

.workspace-section-header > span{
    display:flex;
    align-items:center;
    justify-content:center;
    width:36px;
    height:36px;
    flex:0 0 36px;
    border-radius:50%;
    background:#eef6ff;
    color:#2d7ff9;
    font-weight:700;
}

.workspace-section-header > a{
    color:#2d7ff9;
    font-size:14px;
    text-decoration:none;
}

.workspace-header-actions{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:10px;
}

.workspace-header-actions a{
    color:#2d7ff9;
    font-size:14px;
    text-decoration:none;
}

.workspace-pending-item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:10px;
    padding:14px 16px;
    border:1px solid #e5edf6;
    border-radius:12px;
    background:#fff;
    color:#172033;
    text-decoration:none;
}

.workspace-pending-item:last-of-type{
    margin-bottom:0;
}

.workspace-pending-item b{
    display:block;
    margin-bottom:5px;
}

.workspace-pending-item p{
    margin:0;
    color:#64748b;
    font-size:14px;
}

.workspace-pending-item > span{
    flex:0 0 auto;
    padding:5px 12px;
    border-radius:999px;
    background:#eef6ff;
    color:#2d7ff9;
    font-size:13px;
}

.workspace-empty{
    margin:4px 0 0;
    color:#64748b;
    line-height:1.6;
}

.workspace-action-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
    margin-top:18px;
}

.workspace-action-grid a{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:52px;
    padding:0 12px;
    border:1px solid #dbeafe;
    border-radius:12px;
    background:#f8fbff;
    color:#2d7ff9;
    font-weight:600;
    text-align:center;
    text-decoration:none;
}

.workspace-action-grid a:last-child:nth-child(odd){
    grid-column:1 / -1;
}

.workspace-stat-grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:12px;
}

.workspace-stat-grid a,
.workspace-stat-grid > div,
.workspace-mini-grid > div{
    display:flex;
    min-height:86px;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    padding:14px;
    border:1px solid #e5edf6;
    border-radius:14px;
    background:#f8fbff;
    color:#172033;
    text-decoration:none;
}

.dashboard-license-actions{
    margin-top:0;
}

.workspace-form{
    margin-top:18px;
}

.workspace-form p{
    margin:0 0 16px;
}

.workspace-form label{
    display:block;
    color:#334155;
    font-weight:600;
}

.workspace-alert{
    padding:12px 14px;
    border:1px solid #fecaca;
    border-radius:12px;
    background:#fef2f2;
    color:#dc2626;
    line-height:1.6;
}

.workspace-success{
    padding:12px 14px;
    border:1px solid #bbf7d0;
    border-radius:12px;
    background:#f0fdf4;
    color:#16a34a;
    line-height:1.6;
}

.workspace-help{
    color:#64748b;
    line-height:1.6;
}

.workspace-status-pill{
    width:auto !important;
    min-width:56px;
    padding:0 12px;
    border-radius:999px !important;
    white-space:nowrap;
}

.workspace-photo-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(96px, 1fr));
    gap:10px;
    margin-top:14px;
}

.workspace-photo-grid img{
    width:100%;
    aspect-ratio:1;
    object-fit:cover;
    border-radius:12px;
}

.workspace-member-item{
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    gap:14px;
    align-items:center;
    padding:14px 0;
    border-bottom:1px solid #e5edf6;
}

.workspace-member-item:last-child{
    border-bottom:none;
    padding-bottom:0;
}

.workspace-member-item b{
    display:block;
    color:#172033;
}

.workspace-member-item p{
    margin:6px 0 0;
    color:#64748b;
}

.workspace-inline-forms,
.workspace-member-role-form{
    display:flex;
    gap:8px;
    align-items:center;
    flex-wrap:wrap;
}

.workspace-inline-forms form,
.workspace-member-item form{
    margin:0;
}

.workspace-inline-forms button,
.workspace-member-item button{
    width:auto;
    min-height:42px;
    padding:0 14px;
    font-size:14px;
}

.workspace-member-role-form select{
    width:100%;
    min-width:150px;
    max-width:none;
    min-height:38px;
    padding:7px 34px 7px 11px;
    margin-top:0;
    border-color:#d7e0ea;
    border-radius:6px;
    background-color:#fff;
    font-size:14px;
}

.workspace-member-edit{
    grid-template-columns:minmax(0, 1fr) auto;
}

.workspace-member-actions{
    display:grid;
    grid-template-columns:minmax(150px, 180px) 54px 54px;
    align-items:center;
    gap:8px;
}

.workspace-member-actions-single{
    grid-template-columns:54px;
}

.workspace-member-actions .workspace-member-role-form,
.workspace-member-actions .workspace-member-remove-form{
    display:contents;
}

.workspace-member-locked{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:32px;
    padding:0 10px;
    border:1px solid #d8e1ec;
    border-radius:999px;
    background:#f7fafc;
    color:#7a8aa0;
    font-size:12px;
    font-weight:600;
    white-space:nowrap;
}

.workspace-member-role-form label{
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0, 0, 0, 0);
    white-space:nowrap;
    border:0;
}

.workspace-member-item .workspace-member-save,
.workspace-member-item .workspace-member-remove{
    width:54px;
    min-height:38px;
    padding:0 8px;
    border-radius:6px;
    font-size:13px;
    font-weight:600;
    line-height:1;
}

.workspace-member-item .workspace-member-save{
    border:1px solid #43a66b;
    background:#43a66b;
    color:#fff;
}

.workspace-member-item .workspace-member-remove{
    border:1px solid #dc5b68;
    background:#dc5b68;
    color:#fff;
}

.workspace-member-item .workspace-member-save:hover{
    border-color:#348956;
    background:#348956;
}

.workspace-member-item .workspace-member-remove:hover{
    border-color:#be3f4d;
    background:#be3f4d;
    color:#fff;
}

.owner-site-meta a{
    color:#2d7ff9;
    font-weight:600;
}

.owner-site-info-card{
    padding-top:20px !important;
}

.owner-site-info-list{
    margin-top:2px;
}

.owner-site-info-list p{
    display:grid;
    grid-template-columns:112px minmax(0, 1fr);
    gap:12px;
    margin:0;
    padding:9px 0;
    border-bottom:1px solid #edf2f7;
    color:#334155;
    line-height:1.55;
}

.owner-site-info-list p:last-child{
    border-bottom:none;
    padding-bottom:0;
}

.owner-site-info-list b{
    color:#64748b;
    font-weight:600;
}

.owner-site-info-list span{
    min-width:0;
    overflow-wrap:anywhere;
}

.owner-site-info-list a{
    color:#2d7ff9;
    font-weight:600;
}

.owner-site-activity-link{
    display:block;
    padding:2px 0;
    color:inherit;
    text-decoration:none;
}

.owner-site-activity-static{
    display:block;
    padding:2px 0;
}

.owner-site-activity-detail-link{
    display:inline-flex;
    margin-top:8px;
    color:#2d7ff9;
    font-size:13px;
    font-weight:600;
    text-decoration:none;
}

.owner-site-detail-content{
    margin:0;
    color:#334155;
    line-height:1.8;
    white-space:pre-wrap;
}

.owner-site-detail-images{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(110px, 1fr));
    gap:10px;
    margin-top:16px;
}

.owner-site-detail-images img{
    width:100%;
    aspect-ratio:1;
    object-fit:cover;
    border-radius:12px;
    border:1px solid #e5edf6;
}

.owner-site-task{
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    gap:14px;
    align-items:center;
    padding:14px 0;
    border-bottom:1px solid #e5edf6;
}

.owner-site-task:last-child{
    border-bottom:none;
    padding-bottom:0;
}

.owner-site-task b{
    display:block;
    color:#172033;
    line-height:1.45;
}

.owner-site-task p{
    margin:7px 0;
    color:#475569;
    line-height:1.6;
    white-space:pre-wrap;
}

.owner-site-task small{
    color:#94a3b8;
}

.owner-site-task form{
    margin:0;
}

.owner-site-task button{
    width:auto;
    min-height:44px;
    padding:0 16px;
    white-space:nowrap;
    font-size:15px;
}

.workspace-stat-grid b,
.workspace-mini-grid b{
    display:block;
    margin-bottom:6px;
    color:#2d7ff9;
    font-size:26px;
    line-height:1;
}

.workspace-stat-grid span,
.workspace-mini-grid span{
    color:#64748b;
    font-size:13px;
}

.workspace-mini-grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:12px;
}

.workspace-timeline{
    position:relative;
    margin-top:8px;
}

.workspace-timeline::before{
    content:"";
    position:absolute;
    top:8px;
    bottom:8px;
    left:7px;
    width:2px;
    background:#dbeafe;
}

.workspace-timeline-item{
    position:relative;
    display:flex;
    gap:16px;
    padding:0 0 22px;
}

.workspace-timeline-item:last-child{
    padding-bottom:0;
}

.workspace-timeline-dot{
    position:relative;
    z-index:1;
    width:16px;
    height:16px;
    flex:0 0 16px;
    margin-top:3px;
    box-sizing:border-box;
    border:4px solid #dbeafe;
    border-radius:50%;
    background:#2d7ff9;
}

.workspace-timeline-content{
    min-width:0;
    flex:1;
}

.workspace-timeline-content b{
    display:block;
    color:#172033;
    line-height:1.45;
}

.workspace-timeline-content p{
    margin:7px 0;
    color:#475569;
    line-height:1.6;
    white-space:pre-wrap;
    overflow-wrap:anywhere;
}

.workspace-timeline-content small{
    color:#94a3b8;
    font-size:13px;
}

.activity-image-previews{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 88px));
    gap:8px;
    margin:10px 0;
}

.activity-image-preview{
    display:block;
    width:88px;
    height:88px;
    min-height:0;
    padding:0;
    overflow:hidden;
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#f8fafc;
    cursor:zoom-in;
    text-decoration:none;
}

.activity-image-preview img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}

.activity-image-dialog{
    position:fixed;
    z-index:10000;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    background:rgba(15, 23, 42, .88);
    -webkit-backdrop-filter:blur(2px);
    backdrop-filter:blur(2px);
}

.activity-image-dialog[hidden]{
    display:none;
}

.activity-image-dialog img{
    display:block;
    width:auto;
    max-width:100%;
    height:auto;
    max-height:calc(100vh - 48px);
    margin:auto;
    border-radius:14px;
    object-fit:contain;
}

.activity-image-dialog-close{
    position:fixed;
    z-index:1;
    top:max(16px, env(safe-area-inset-top));
    right:16px;
    width:36px;
    height:36px;
    min-height:0;
    padding:0;
    border:2px solid #fff;
    border-radius:50%;
    background:#172033;
    color:#fff;
    font-size:25px;
    line-height:30px;
}

.activity-image-preview-open{
    overflow:hidden;
}

@media (max-width:480px){
    .activity-image-previews{
        grid-template-columns:repeat(3, minmax(0, 1fr));
    }

    .activity-image-preview{
        width:100%;
        height:auto;
        aspect-ratio:1;
    }
}

.workspace-timeline-alert,
.workspace-timeline-alert b,
.workspace-timeline-alert p,
.workspace-timeline-alert small,
.workspace-timeline-alert a{
    color:#dc2626 !important;
}

.workspace-activity-delete-form{
    display:inline-flex;
    margin:6px 0 0;
}

.workspace-activity-delete-form button{
    width:auto;
    min-height:0;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    color:#2d7ff9;
    font-size:13px;
    font-weight:600;
    line-height:1.4;
}

.workspace-activity-delete-form button:hover{
    background:transparent;
    color:#1d64d8;
    text-decoration:underline;
}

.workspace-back{
    padding:4px 0 26px;
    text-align:center;
}

.workspace-back a{
    color:#64748b;
    text-decoration:none;
}

.workspace-back-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:36px;
    padding:0 18px;
    border:1px solid #dbeafe;
    border-radius:12px;
    background:#fff;
    color:#2d7ff9 !important;
    font-size:14px;
    font-weight:600;
}

.workspace-invite-intro{
    margin:0 0 18px;
    color:#64748b;
    line-height:1.7;
}

.workspace-copy-list{
    display:grid;
    gap:14px;
}

.workspace-copy-item{
    display:grid;
    gap:8px;
}

.workspace-copy-item > b{
    color:#64748b;
    font-size:13px;
}

.workspace-copy-row{
    display:grid;
    grid-template-columns:minmax(0, 1fr) 72px;
    gap:10px;
    align-items:stretch;
}

.workspace-copy-value{
    min-width:0;
    padding:12px;
    border:1px solid #e5edf6;
    border-radius:12px;
    background:#f8fbff;
    color:#172033;
    line-height:1.6;
    overflow-wrap:anywhere;
}

.workspace-copy-code{
    color:#2d7ff9;
    font-size:22px;
    font-weight:700;
    letter-spacing:1px;
}

.workspace-copy-button{
    width:72px;
    min-height:0;
    padding:0;
    border-radius:12px;
    background:#2d7ff9;
    font-size:15px;
}

.workspace-copy-msg{
    min-height:22px;
    margin:12px 0 0;
    color:#2d7ff9;
    font-size:14px;
}

@media (max-width:600px){

    .project-workspace-container{
        padding:14px;
    }

    .project-workspace-container > .card{
        padding:18px;
        border-radius:18px;
    }

    .project-workspace-container h1{
        font-size:24px;
    }

    .project-workspace-container h2{
        font-size:20px;
    }

    .workspace-action-grid{
        gap:10px;
    }

    .workspace-hero-header,
    .workspace-meta-grid{
        grid-template-columns:1fr;
    }

    .workspace-hero-header{
        display:block;
    }

    .workspace-hero-header > a{
        display:inline-block;
        margin-top:10px;
    }

    .workspace-stat-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    .workspace-mini-grid{
        grid-template-columns:1fr;
    }

    .workspace-action-grid a{
        min-height:50px;
        font-size:15px;
    }

    .workspace-member-item,
    .workspace-member-edit,
    .owner-site-task{
        grid-template-columns:1fr;
    }

    .workspace-inline-forms,
    .workspace-member-role-form{
        width:100%;
    }

    .workspace-member-actions{
        width:100%;
        grid-template-columns:minmax(0, 1fr) 54px 54px;
        gap:8px;
    }

    .workspace-member-actions-single{
        grid-template-columns:54px;
        justify-content:end;
    }

    .workspace-member-locked{
        justify-self:start;
        white-space:normal;
        text-align:center;
    }

    .workspace-member-role-form{
        width:100%;
    }

    .workspace-member-role-form select{
        width:100%;
        min-width:0;
        max-width:none;
    }

    .workspace-member-item .workspace-member-save,
    .workspace-member-item .workspace-member-remove{
        width:54px;
    }

    .workspace-inline-forms form,
    .workspace-inline-forms button,
    .owner-site-task button{
        width:100%;
    }

    .workspace-member-remove-form{
        width:auto;
    }

    .owner-site-info-list p{
        grid-template-columns:92px minmax(0, 1fr);
        gap:10px;
    }
}
/* Account and security pages */
.account-page {
    min-height: 100vh;
    margin: 0;
    display: grid;
    place-items: center;
    padding: 24px 12px;
    box-sizing: border-box;
    background:
        radial-gradient(circle at 80% 10%, rgba(22,119,255,.12), transparent 28%),
        #f4f7fb;
}

.account-container {
    width: min(440px, 100%);
    margin: 0;
    padding: 0;
}

.account-card {
    margin: 0;
    padding: 28px;
    border: 1px solid #dce6f3;
    border-radius: 16px;
    box-shadow: 0 16px 50px rgba(37,76,130,.08);
}

.account-card h1 {
    margin: 8px 0 0;
    color: #17243b;
    text-align: center;
}

.account-subtitle {
    margin: 10px auto 22px;
    color: #6d7b8f;
    font-size: 13px;
    line-height: 1.7;
    text-align: center;
}

.wechat-login-btn {
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: #07c160;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}

.wechat-login-btn::before {
    content: "微";
    width: 23px;
    height: 23px;
    display: grid;
    place-items: center;
    margin-right: 8px;
    border-radius: 50%;
    background: rgba(255,255,255,.2);
    font-size: 11px;
}

.account-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 21px 0;
    color: #9aa5b5;
    font-size: 11px;
}

.account-divider::before,
.account-divider::after {
    content: "";
    height: 1px;
    flex: 1;
    background: #e3e9f1;
}

.account-links {
    display: flex;
    justify-content: space-between;
    gap: 15px;
    margin-top: 20px;
    color: #6c7889;
    font-size: 12px;
}

.account-links a {
    color: #1677ff;
    text-decoration: none;
}

.account-back {
    color: #59708e;
    font-size: 12px;
    text-decoration: none;
}

.account-message {
    padding: 10px 12px;
    border-radius: 8px;
    font-size: 12px;
    line-height: 1.6;
}

.account-message.is-error {
    background: #fff1f1;
    color: #c23e3e;
}

.account-message.is-success {
    background: #eaf8f0;
    color: #16824d;
}

.account-help {
    margin: 18px 0 0;
    color: #8b96a6;
    font-size: 11px;
    line-height: 1.7;
    text-align: center;
}

.dashboard-account-link {
    display: inline-block;
    margin-top: 7px;
    color: #1677ff;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
}

@media (max-width: 480px) {
    .account-card {
        padding: 24px 20px;
    }

    .account-links {
        align-items: flex-start;
        flex-direction: column;
    }
}
