/* VURL responsive / SP / PWA layout v1.14 */
html,body{max-width:100%;overflow-x:hidden}
body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);padding-bottom:env(safe-area-inset-bottom)}
img,svg{max-width:100%}
input,select,textarea{min-width:0;max-width:100%}
button,.btn,.workspace-tab,.team-add-link,.team-tool-link,.copy-mini,.mini,.text-link,.text-btn,
.extension-store-btn,.extension-strip a,.mobile-menu-panel a{
    white-space:nowrap;
}
.url-main>*,
.main>*,
.short-wrap,
.memo-row>*,
.utm-row>*,
.access-row>*,
.url-details-body>*{
    min-width:0;
}
.original-url,.original,.memo-text,.utm-text,.access-value,.access-item span{
    max-width:100%;
    overflow-wrap:anywhere;
    word-break:break-word;
}

/* Generic mobile hamburger */
.mobile-menu-toggle{
    display:none;
    flex:0 0 auto;
    width:44px!important;
    height:44px;
    margin:0!important;
    padding:10px!important;
    border:1px solid #d0d5dd!important;
    border-radius:10px!important;
    background:#fff!important;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:4px;
    box-shadow:0 1px 3px rgba(16,24,40,.08);
}
.mobile-menu-toggle span{
    display:block;
    width:20px;
    height:2px;
    border-radius:999px;
    background:#344054;
}
.mobile-menu-panel{
    display:none;
    position:absolute;
    top:calc(100% + 8px);
    right:0;
    z-index:1000;
    min-width:210px;
    padding:8px;
    border:1px solid #e1e7ef;
    border-radius:12px;
    background:#fff;
    box-shadow:0 14px 36px rgba(16,24,40,.16);
}
.mobile-menu-panel.open{display:block}
.mobile-menu-panel a{
    display:block;
    padding:11px 12px;
    border-radius:8px;
    color:#344054;
    text-decoration:none;
    font-size:14px;
    font-weight:700;
}
.mobile-menu-panel a:hover,
.mobile-menu-panel a:focus{background:#f3f6fb}
.mobile-menu-panel .menu-danger{color:#b42318}

/* URL detail drawer - default closed on PC/SP */
.url-details{
    margin-top:10px;
    border-top:1px solid rgba(148,163,184,.20);
}
.url-details>summary{
    list-style:none;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:7px;
    min-height:38px;
    padding:8px 2px 0;
    color:#475467;
    font-size:12px;
    font-weight:800;
    user-select:none;
}
.url-details>summary::-webkit-details-marker{display:none}
.url-details>summary::after{
    content:"＋";
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:22px;
    height:22px;
    border-radius:50%;
    background:#eef2f8;
    color:#344054;
}
.url-details[open]>summary::after{content:"－"}
.url-details-body{padding-top:1px}

/* Desktop overflow safety */
.original-url.expanded,.original.expanded{
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
}
.short-link{min-width:0}
.utm-text,.memo-text{overflow-wrap:anywhere;word-break:break-word}

/* Index page */
.vurl-home-page .topbar{position:relative}
.vurl-home-page .topbar-links{display:flex;gap:10px;align-items:center}

/* Personal dashboard */
.vurl-dashboard-page .top{position:relative}
.vurl-dashboard-page .dashboard-title{min-width:0}
.vurl-dashboard-page .dashboard-title h1{overflow-wrap:normal;word-break:keep-all}
.vurl-dashboard-page .sub{overflow-wrap:anywhere;word-break:break-word}

/* Team dashboard */
.vurl-team-dashboard-page .team-header{position:relative}
.vurl-team-dashboard-page .team-header>div:first-child{min-width:0}
.vurl-team-dashboard-page .team-header h1{overflow-wrap:normal;word-break:keep-all}

/* SP */
@media(max-width:768px){
    /* Common card/page sizing */
    .auth-wrap,
    .auth-wrap.wide{
        width:100%!important;
        max-width:none!important;
        margin:0 auto!important;
        padding:12px!important;
    }
    .auth-card{
        padding:18px!important;
        border-radius:14px!important;
    }
    .mobile-menu-toggle{display:inline-flex}
    .workspace-tabs,
    .workspace-tabs-row{display:none!important}

    /* Home */
    .vurl-home-page .topbar{
        min-height:58px;
        margin:0 auto;
        padding:12px 14px 0;
        max-width:none;
    }
    .vurl-home-page .topbar-links{display:none}
    .vurl-home-page .topbar .mobile-menu-toggle{margin-left:auto!important}
    .vurl-home-page .wrap{
        width:100%;
        max-width:none;
        margin:0 auto;
        padding:12px;
    }
    .vurl-home-page .card{
        padding:20px 18px;
        border-radius:15px;
    }
    .vurl-home-page h1{font-size:32px}
    .vurl-home-page .brand-title{padding-right:0}
    .vurl-home-page .login-state{
        position:static;
        display:inline-flex;
        width:max-content;
        max-width:100%;
        margin:0 0 10px auto;
    }
    .vurl-home-page .custom-row{
        grid-template-columns:minmax(0,1fr);
    }
    .vurl-home-page .custom-row .remove-btn{
        width:auto;
        justify-self:start;
        padding:9px 12px;
    }
    .vurl-home-page .utm-grid{grid-template-columns:1fr!important}
    .vurl-home-page .setting-inline{
        align-items:flex-start;
        flex-direction:column;
    }

    /* Personal dashboard header */
    .vurl-dashboard-page .top{
        display:grid!important;
        grid-template-columns:minmax(0,1fr) auto;
        gap:12px!important;
        align-items:start!important;
    }
    .vurl-dashboard-page .top-actions{display:none!important}
    .vurl-dashboard-page .dashboard-title{
        gap:8px!important;
        align-items:center!important;
    }
    .vurl-dashboard-page .dashboard-title img{
        width:34px!important;
        height:34px!important;
    }
    .vurl-dashboard-page .dashboard-title h1{
        font-size:clamp(22px,6.5vw,29px)!important;
        line-height:1.12;
        white-space:nowrap;
        margin:0!important;
    }
    .vurl-dashboard-page .sub{
        margin:7px 0 0!important;
        font-size:13px;
    }

    /* Personal URL card */
    .vurl-dashboard-page .url-item{
        padding:13px!important;
        margin:10px 0!important;
        border-radius:12px!important;
    }
    .vurl-dashboard-page .url-main{
        display:grid!important;
        grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
        gap:12px 10px!important;
        align-items:start!important;
    }
    .vurl-dashboard-page .url-main>div:nth-child(1),
    .vurl-dashboard-page .url-main>div:nth-child(2){
        grid-column:1/-1;
    }
    .vurl-dashboard-page .url-main>div:nth-child(n+3){
        text-align:left!important;
    }
    .vurl-dashboard-page .url-main>div::before{
        display:block!important;
        margin-bottom:4px!important;
        white-space:nowrap;
    }
    .vurl-dashboard-page .short-wrap{
        width:100%;
        max-width:100%;
        overflow:hidden;
    }
    .vurl-dashboard-page .short-link{
        max-width:calc(100% - 64px)!important;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }
    .vurl-dashboard-page .original-url{
        white-space:normal!important;
        overflow:hidden!important;
        text-overflow:clip!important;
        overflow-wrap:anywhere!important;
        word-break:break-word!important;
        display:-webkit-box;
        -webkit-box-orient:vertical;
        -webkit-line-clamp:3;
        line-clamp:3;
    }
    .vurl-dashboard-page .original-url.expanded{
        display:block;
        -webkit-line-clamp:unset;
        line-clamp:unset;
    }
    .vurl-dashboard-page .url-main>div:last-child{
        display:flex;
        align-items:flex-start;
        justify-content:flex-start;
    }
    .vurl-dashboard-page .url-main>div:last-child form{margin:0}
    .vurl-dashboard-page .extension-strip{
        margin-top:14px!important;
    }
    .vurl-dashboard-page .memo-row,
    .vurl-dashboard-page .utm-row{
        display:grid!important;
        grid-template-columns:auto minmax(0,1fr) auto!important;
        gap:8px!important;
        align-items:start!important;
    }
    .vurl-dashboard-page .access-row{
        display:grid!important;
        grid-template-columns:1fr!important;
        gap:10px!important;
        align-items:start!important;
    }
    .vurl-dashboard-page .access-item{
        display:grid!important;
        grid-template-columns:auto minmax(0,1fr)!important;
        gap:7px!important;
        align-items:start!important;
    }
    .vurl-dashboard-page .access-item strong,
    .vurl-dashboard-page .memo-label,
    .vurl-dashboard-page .utm-label{white-space:nowrap}
    .vurl-dashboard-page .modal{
        width:min(100%,470px)!important;
        max-height:calc(100dvh - 28px);
        overflow:auto;
        padding:18px!important;
    }

    /* Team header */
    .vurl-team-dashboard-page .auth-wrap{
        width:100%!important;
        max-width:none!important;
    }
    .vurl-team-dashboard-page .team-header{
        display:grid!important;
        grid-template-columns:minmax(0,1fr) auto!important;
        gap:12px!important;
        align-items:start!important;
    }
    .vurl-team-dashboard-page .team-tools,
    .vurl-team-dashboard-page .team-create-action{display:none!important}
    .vurl-team-dashboard-page .team-header h1{
        font-size:clamp(21px,6vw,28px)!important;
        line-height:1.15;
        white-space:normal;
        margin:0 0 8px!important;
    }
    .vurl-team-dashboard-page .team-header .sub{
        overflow-wrap:anywhere;
        word-break:break-word;
    }

    /* Team URL card */
    .vurl-team-dashboard-page .item{
        padding:13px!important;
        margin:10px 0!important;
    }
    .vurl-team-dashboard-page .main{
        display:grid!important;
        grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
        gap:12px 10px!important;
        align-items:start!important;
    }
    .vurl-team-dashboard-page .main>div:nth-child(1),
    .vurl-team-dashboard-page .main>div:nth-child(2),
    .vurl-team-dashboard-page .main>div:nth-child(3){
        grid-column:1/-1;
    }
    .vurl-team-dashboard-page .main>div:nth-child(n+4){
        text-align:left!important;
    }
    .vurl-team-dashboard-page .main>div::before{
        display:block;
        color:#667085;
        font-size:11px;
        font-weight:700;
        margin-bottom:4px;
        white-space:nowrap;
    }
    .vurl-team-dashboard-page .main>div:nth-child(1)::before{content:"短縮URL"}
    .vurl-team-dashboard-page .main>div:nth-child(2)::before{content:"元URL"}
    .vurl-team-dashboard-page .main>div:nth-child(3)::before{content:"作成者"}
    .vurl-team-dashboard-page .main>div:nth-child(4)::before{content:"クリック"}
    .vurl-team-dashboard-page .main>div:nth-child(5)::before{content:"期限"}
    .vurl-team-dashboard-page .main>div:nth-child(6)::before{content:"状態"}
    .vurl-team-dashboard-page .main>div:nth-child(7)::before{content:""}
    .vurl-team-dashboard-page .short-wrap{
        width:100%;
        max-width:100%;
        overflow:hidden;
    }
    .vurl-team-dashboard-page .short-link{
        max-width:calc(100% - 64px)!important;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }
    .vurl-team-dashboard-page .original{
        white-space:normal!important;
        overflow:hidden!important;
        text-overflow:clip!important;
        overflow-wrap:anywhere!important;
        word-break:break-word!important;
        display:-webkit-box;
        -webkit-box-orient:vertical;
        -webkit-line-clamp:3;
        line-clamp:3;
    }
    .vurl-team-dashboard-page .original.expanded{
        display:block;
        -webkit-line-clamp:unset;
        line-clamp:unset;
    }
    .vurl-team-dashboard-page .memo,
    .vurl-team-dashboard-page .utm-row{
        display:grid!important;
        grid-template-columns:auto minmax(0,1fr) auto!important;
        gap:8px!important;
        align-items:start!important;
    }
    .vurl-team-dashboard-page .access-row{
        display:grid!important;
        grid-template-columns:1fr!important;
        gap:10px!important;
    }
    .vurl-team-dashboard-page .access-item{
        display:grid!important;
        grid-template-columns:auto minmax(0,1fr)!important;
        gap:7px!important;
        align-items:start!important;
    }
    .vurl-team-dashboard-page .modal{
        width:min(100%,460px)!important;
        max-height:calc(100dvh - 28px);
        overflow:auto;
    }

    /* Footer */
    .vurl-site-footer{
        padding:0 14px!important;
        overflow-wrap:anywhere;
    }
}

@media(max-width:390px){
    .vurl-dashboard-page .dashboard-title h1{font-size:22px!important}
    .vurl-team-dashboard-page .team-header h1{font-size:21px!important}
    .extension-strip{padding:11px!important}
    .extension-strip a{font-size:11px!important;padding:8px 10px!important}
}

/* Standalone PWA */
@media(display-mode:standalone){
    body{overscroll-behavior-y:none}
    .vurl-home-page .topbar{padding-top:max(12px,env(safe-area-inset-top))}
    .vurl-dashboard-page .auth-wrap,
    .vurl-team-dashboard-page .auth-wrap{padding-top:max(12px,env(safe-area-inset-top))!important}
}

/* Extension promotion toggle v1.16 */
.extension-promo-widget{position:relative}
.extension-promo-full{position:relative}
.extension-promo-compact{
    display:none;
    appearance:none;
    border:0;
    background:transparent;
    color:#344054;
    padding:4px 0;
    margin:0;
    font:inherit;
    font-size:13px;
    font-weight:800;
    line-height:1.4;
    cursor:pointer;
    text-decoration:underline;
    text-underline-offset:3px;
    white-space:nowrap;
}
.extension-promo-collapse{
    position:absolute;
    top:10px;
    right:10px;
    width:auto!important;
    min-height:auto!important;
    border:0!important;
    background:transparent!important;
    color:#667085!important;
    padding:3px 5px!important;
    margin:0!important;
    font-size:11px!important;
    font-weight:700!important;
    line-height:1.2!important;
    cursor:pointer;
    white-space:nowrap;
    box-shadow:none!important;
}
.extension-promo-widget.is-collapsed{margin:8px 0}
.extension-promo-widget.is-collapsed .extension-promo-full{display:none!important}
.extension-promo-widget.is-collapsed .extension-promo-compact{display:inline-block}
html.vurl-extension-promo-collapsed .extension-success[data-vurl-extension-promo]{display:none!important}

/* Before JS initializes, smartphones start in compact mode to avoid promo flash. */
@media(max-width:768px){
    .extension-promo-widget:not(.is-ready) .extension-promo-full{display:none!important}
    .extension-promo-widget:not(.is-ready) .extension-promo-compact{display:inline-block}
    .extension-promo-widget{margin:8px 0}
}