/* Qurk Subscription Frontend Styles */
.qurk-sub-wrap{max-width:1080px;margin:24px auto;padding:0 16px;font-size:15px;color:#333;}
.qurk-sub-wrap *{box-sizing:border-box;}

.qurk-sub-current{display:flex;align-items:center;gap:16px;padding:16px 20px;margin-bottom:24px;
    background:linear-gradient(135deg,#fff7e0 0%,#ffe9b0 100%);
    border-radius:12px;border:1px solid #f5d68a;}
.qurk-sub-current-badge{display:inline-flex;align-items:center;justify-content:center;
    width:48px;height:48px;border-radius:50%;background:#d99a2b;color:#fff;font-weight:700;font-size:14px;}
.qurk-sub-current-info p{margin:2px 0;}
.qurk-sub-current-title strong{color:#b97a17;}
.qurk-sub-current-expire{color:#7a5b1f;font-size:13px;}

.qurk-sub-plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;}
.qurk-sub-plan{position:relative;padding:28px 24px;background:#fff;border:1px solid #ececec;
    border-radius:14px;text-align:center;transition:transform .2s ease, box-shadow .2s ease;}
.qurk-sub-plan:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(0,0,0,.06);}
.qurk-sub-plan.is-recommend{border-color:#ff5a36;box-shadow:0 12px 32px rgba(255,90,54,.12);}
.qurk-sub-plan-tag{position:absolute;top:-10px;right:18px;background:#ff5a36;color:#fff;
    font-size:12px;padding:2px 10px;border-radius:10px;}
.qurk-sub-plan-label{font-size:18px;font-weight:600;color:#222;}
.qurk-sub-plan-desc{margin-top:6px;font-size:13px;color:#888;}
.qurk-sub-plan-price{margin:18px 0 22px;color:#222;}
.qurk-sub-currency{font-size:18px;}
.qurk-sub-amount{font-size:36px;font-weight:700;letter-spacing:-1px;}
.qurk-sub-unit{font-size:13px;color:#888;margin-left:4px;}
.qurk-sub-btn{width:100%;padding:11px 0;border:0;border-radius:999px;cursor:pointer;
    background:#222;color:#fff;font-size:15px;font-weight:500;transition:background .2s;}
.qurk-sub-btn:hover{background:#000;}
.qurk-sub-plan.is-recommend .qurk-sub-btn{background:#ff5a36;}
.qurk-sub-plan.is-recommend .qurk-sub-btn:hover{background:#e84418;}

.qurk-sub-note{margin-top:24px;text-align:center;color:#888;font-size:13px;}

/* Modal */
.qurk-sub-modal{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;}
.qurk-sub-modal[hidden]{display:none !important;}
.qurk-sub-modal-mask{position:absolute;inset:0;background:rgba(0,0,0,.55);}
.qurk-sub-modal-body{position:relative;width:360px;max-width:92vw;background:#fff;border-radius:16px;
    padding:28px 24px 22px;text-align:center;box-shadow:0 24px 60px rgba(0,0,0,.25);}
.qurk-sub-modal-close{position:absolute;top:8px;right:12px;background:transparent;border:0;
    font-size:24px;color:#999;cursor:pointer;line-height:1;}
.qurk-sub-modal-close:hover{color:#333;}
.qurk-sub-modal-title{margin:0 0 12px;font-size:18px;font-weight:600;color:#222;}
.qurk-sub-modal-info{margin-bottom:14px;color:#444;}
.qurk-sub-modal-info strong{color:#ff5a36;font-size:18px;margin-left:6px;}
.qurk-sub-qrcode{display:flex;align-items:center;justify-content:center;
    width:220px;height:220px;margin:0 auto;padding:10px;background:#fafafa;border-radius:12px;
    border:1px solid #eee;}
.qurk-sub-qrcode img,.qurk-sub-qrcode canvas{display:block;width:100%;height:100%;}
.qurk-sub-modal-tip{margin:14px 0 6px;color:#666;font-size:13px;}
.qurk-sub-modal-tip.is-success{color:#46b450;font-weight:500;}
.qurk-sub-modal-tip.is-error{color:#d54e21;}
.qurk-sub-modal-order{font-size:12px;color:#aaa;}
.qurk-sub-modal-order code{font-size:12px;background:transparent;color:#666;}

@media (max-width:540px){
    .qurk-sub-plan{padding:22px 18px;}
    .qurk-sub-amount{font-size:30px;}
}

/* ============================================================
 * Paywall: 解锁卡片
 * ============================================================ */
.qurk-paywall-card{
    display:flex;align-items:center;gap:16px;padding:24px 28px;
    margin:24px 0;border-radius:14px;
    background:linear-gradient(135deg,#f8f9ff 0%,#eef1ff 100%);
    border:1px solid #dde3f7;
    box-shadow:0 4px 16px rgba(100,108,255,.06);
}
.qurk-paywall-card-icon{font-size:32px;flex-shrink:0;}
.qurk-paywall-card-body{flex:1;min-width:0;}
.qurk-paywall-card-title{margin:0 0 4px;font-size:16px;font-weight:600;color:#222;}
.qurk-paywall-card-desc{margin:0;font-size:13px;color:#666;}
.qurk-paywall-card-extra{margin:6px 0 0;font-size:12px;color:#999;}
.qurk-paywall-card-btn{
    flex-shrink:0;padding:10px 22px;border:0;border-radius:999px;
    background:#4f5bd5;color:#fff;font-size:14px;font-weight:500;
    cursor:pointer;transition:background .2s,transform .15s;
    white-space:nowrap;
}
.qurk-paywall-card-btn:hover{background:#3b47c7;transform:scale(1.03);}

/* 场景变体 */
.qurk-paywall-card-resource{background:linear-gradient(135deg,#fff8f0 0%,#ffeed9 100%);border-color:#f5d8a8;}
.qurk-paywall-card-resource .qurk-paywall-card-btn{background:#e6820e;}
.qurk-paywall-card-resource .qurk-paywall-card-btn:hover{background:#c56d08;}

.qurk-paywall-card-premium{background:linear-gradient(135deg,#f0fff4 0%,#d4f7dc 100%);border-color:#a8e6b4;}
.qurk-paywall-card-premium .qurk-paywall-card-btn{background:#28a745;}
.qurk-paywall-card-premium .qurk-paywall-card-btn:hover{background:#1e8736;}

/* 试读预览文字 */
.qurk-paywall-preview{
    position:relative;margin-bottom:0;padding-bottom:40px;
    -webkit-mask-image:linear-gradient(to bottom,#000 60%,transparent 100%);
    mask-image:linear-gradient(to bottom,#000 60%,transparent 100%);
}

/* ============================================================
 * Paywall: 资源链接
 * ============================================================ */
.qurk-resource-link{
    display:inline-flex;align-items:center;gap:6px;padding:10px 20px;
    background:#f0f6ff;color:#1a56db;border:1px solid #c3d9f8;border-radius:8px;
    font-size:14px;font-weight:500;text-decoration:none;transition:background .2s;
}
.qurk-resource-link:hover{background:#dbeafe;}
.qurk-resource-video{margin:16px 0;border-radius:10px;overflow:hidden;}
.qurk-resource-video video{width:100%;display:block;}

/* ============================================================
 * Paywall: 按钮拦截样式
 * ============================================================ */
.qurk-paid-btn-locked{
    display:inline-flex;align-items:center;gap:6px;padding:10px 20px;
    background:#f5f5f5;color:#666;border:1px dashed #ccc;border-radius:8px;
    font-size:14px;cursor:pointer;text-decoration:none;transition:background .2s,border-color .2s;
}
.qurk-paid-btn-locked:hover{background:#eee;border-color:#999;}
.qurk-paid-unlocked{text-decoration:none;}

/* ============================================================
 * Paywall Modal: 套餐选择步骤
 * ============================================================ */
.qurk-paywall-plans{display:flex;flex-direction:column;gap:10px;margin:16px 0;}
.qurk-paywall-plan-item{
    display:flex;align-items:center;justify-content:space-between;
    padding:14px 18px;border:2px solid #eee;border-radius:10px;
    cursor:pointer;transition:border-color .2s,background .2s;
}
.qurk-paywall-plan-item:hover{border-color:#bbb;}
.qurk-paywall-plan-item.is-selected{border-color:#4f5bd5;background:#f5f6ff;}
.qurk-paywall-plan-label{font-size:15px;font-weight:500;color:#222;}
.qurk-paywall-plan-price{font-size:16px;font-weight:700;color:#ff5a36;}
.qurk-paywall-confirm-btn{
    width:100%;padding:12px 0;margin-top:8px;border:0;border-radius:999px;
    background:#4f5bd5;color:#fff;font-size:15px;font-weight:500;
    cursor:pointer;transition:background .2s;
}
.qurk-paywall-confirm-btn:hover{background:#3b47c7;}

/* 付费内容容器 */
.qurk-premium-content{padding:16px 0;}
.qurk-premium-content.qurk-premium-preview{position:relative;border:2px dashed #ffba00;padding:20px;background:#fff8e1;}
.qurk-premium-content.qurk-premium-preview::before{content:"👁️ 管理员预览模式（访客看到的是订阅解锁卡片）";display:block;font-size:12px;color:#996600;font-weight:bold;margin-bottom:8px;}

@media (max-width:540px){
    .qurk-paywall-card{flex-direction:column;text-align:center;gap:12px;padding:20px 16px;}
    .qurk-paywall-card-btn{width:100%;}
}