@import"https://fonts.googleapis.com/css2?family=Doto:wght@100..900&family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap";:root{--size-font-11: .6875rem;--size-font-12: .75rem;--size-font-13: .8125rem;--size-font-14: .875rem;--size-font-15: .9375rem;--size-font-16: 1rem;--size-font-17: 1.0625rem;--size-font-18: 1.125rem;--size-font-19: 1.1875rem;--size-font-20: 1.25rem;--size-font-24: 1.5rem}:root{--color-text-0: #fff;--color-text-1: #111;--color-text-2: #666;--color-bg-0: #111;--color-bg-1: #fff;--color-bg-2: #ddd;--color-divider: #eaeaea;--color-border: #ccc;--color-border-ui: #aaa;--color-blue: #14A0FF}@font-face{font-family:Hiragino Sans;font-weight:100;src:local(HiraginoSans-W0)}@font-face{font-family:Hiragino Sans;font-weight:200;src:local(HiraginoSans-W1)}@font-face{font-family:Hiragino Sans;font-weight:300;src:local(HiraginoSans-W2)}@font-face{font-family:Hiragino Sans;font-weight:400;src:local(HiraginoSans-W3)}@font-face{font-family:Hiragino Sans;font-weight:500;src:local(HiraginoSans-W4)}@font-face{font-family:Hiragino Sans;font-weight:600;src:local(HiraginoSans-W5)}@font-face{font-family:Hiragino Sans;font-weight:700;src:local(HiraginoSans-W6)}@font-face{font-family:Hiragino Sans;font-weight:800;src:local(HiraginoSans-W7)}@font-face{font-family:Hiragino Sans;font-weight:900;src:local(HiraginoSans-W8)}@font-face{font-family:Hiragino Sans W9;font-weight:900;src:local(HiraginoSans-W9)}body,button{font-family:-apple-system,BlinkMacSystemFont,Hiragino Sans,Noto Sans JP,sans-serif}html,body,p,ul,ol,dd,figure,address{margin:0;padding:0;font-style:normal;font-weight:400}dl{margin:0;padding:0}h1,h2,h3,h4,dt{margin:0;padding:0;font-style:normal;font-weight:700}li{list-style:none}a{color:var(--color-text-1)}button{padding:0;border:none;cursor:pointer}address{font-style:normal;font-weight:400}dialog{margin:0;padding:0;border:none;color:inherit;inset-inline:initial}body{-webkit-text-size-adjust:100%}input[type=text],input[type=submit]{-webkit-appearance:none;-moz-appearance:none;appearance:none}input::-webkit-input-placeholder{line-height:1.286}textarea{box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}html,body,#storybook-root,#root{height:100%}body{background-color:var(--color-bg-1);color:var(--color-text-1);font-size:var(--size-font-15)}#root{display:flex;flex-direction:column;align-items:center;justify-content:flex-start}form{width:100%}textarea{width:100%;padding:7px 11px;border:1px solid var(--color-border);font-size:var(--size-font-14)}::-moz-selection{background:#00a0f04d}::selection{background:#00a0f04d}input::-moz-placeholder{color:#bbb}input::placeholder{color:#bbb}textarea::-moz-placeholder{color:#bbb}textarea::placeholder{color:#bbb}@media (min-width: 520px){.display-narrow{display:none!important}}@media (max-width: 519px){.display-wide{display:none!important}}.arrowWrapper{width:30px;height:auto}@supports (aspect-ratio: 60/60){.arrowWrapper{aspect-ratio:60/60}}@supports not (aspect-ratio: 60/60){.arrowWrapper{position:relative;width:100%;padding-top:100%}.arrowWrapper>*{position:absolute;top:0}}.arrowWrapper>svg{-o-object-fit:cover;object-fit:cover}.button{color:var(--color-text-0);font-size:var(--size-font-15);line-height:1;text-align:center;text-decoration:none;padding:8.5px 12px;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;background-color:var(--color-text-1);display:block}.button.large{font-size:var(--size-font-16);font-weight:700;padding:14px 18px;filter:drop-shadow(6px 6px 0 rgba(0,0,0,.075))}.buttonOutline{color:var(--color-text-1);font-size:var(--size-font-15);line-height:1;text-align:center;text-decoration:none;padding:6.5px 10px;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;border:2px solid var(--color-text-1);display:block}.headerWrapper{width:100%;height:60px;display:flex;align-items:center;margin:0 auto;padding:0 16px;box-sizing:border-box}.headerLogo>a{text-decoration:none}.headerLogo .logoWrapper{height:36px}@media (max-width: 519px){.headerLogo .logoWrapper{width:36px;overflow:hidden}}@media (min-width: 520px){.headerLogo .logoWrapper{width:auto}}.headerMenu{display:flex;align-items:center;justify-content:flex-end;gap:16px;flex-grow:1}.userMenuWrapper{position:relative}.userMenuWrapper label{display:block;cursor:pointer}.userMenu{position:absolute;background-color:var(--color-bg-1);border:1px solid var(--color-border);top:calc(100% + 8px);right:0;opacity:0;transition:opacity .2s ease-out;pointer-events:none;z-index:1}.userMenu li:nth-child(n+2){border-top:1px solid var(--color-divider)}.userMenu li a{font-size:var(--size-font-14);line-height:1.25;text-decoration:none;padding:11px 14px;display:block;white-space:nowrap}.userMenu li a:hover{background-color:#0000001a}.toggleinput{display:none}.toggleinput:checked~.userMenu{opacity:1;pointer-events:auto}@media (max-width: 519px){.iconWrapper{width:72px;height:72px}}@media (min-width: 520px){.iconWrapper{width:96px;height:96px}}.iconWrapper>a{display:flex;justify-content:center;align-items:center;width:100%;height:100%;position:relative}.iconWrapper>a:focus{outline:none}.iconWrapper>a:hover .iconName,.iconWrapper>a:focus .iconName{animation:titlePopUp .1s ease-out both}.iconWrapper>a:hover .iconImage,.iconWrapper>a:focus .iconImage{transform:scale(.9);filter:drop-shadow(0px 0px 0 rgba(0,0,0,.15))}.iconImage{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;vertical-align:middle;transition:transform .1s ease-out;filter:drop-shadow(6px 6px 0 rgba(0,0,0,.075))}.iconName{width:-moz-fit-content;width:fit-content;max-width:300px;color:var(--color-text-0);font-size:var(--size-font-13);font-weight:400;text-align:center;line-height:12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;position:absolute;bottom:-27px;opacity:0;transition:opacity 125ms linear;pointer-events:none;background-color:var(--color-bg-0);border-radius:12px;padding:6px 12px;z-index:1}@keyframes titlePopUp{0%{transform:translateY(-100%);opacity:0}80%{transform:translateY(40%)}to{transform:translateY(0);opacity:1}}@media (max-width: 519px){@supports (aspect-ratio: 1/1){.logoWrapper{aspect-ratio:1/1}}@supports not (aspect-ratio: 1/1){.logoWrapper{position:relative;width:100%;padding-top:100%}.logoWrapper>*{position:absolute;top:0}}.logoWrapper>svg{height:100%;-o-object-fit:contain;object-fit:contain}}@media (min-width: 520px){@supports (aspect-ratio: 2430/384){.logoWrapper{aspect-ratio:2430/384}}@supports not (aspect-ratio: 2430/384){.logoWrapper{position:relative;width:100%;padding-top:calc(384 / 2430 * 100%)}.logoWrapper>*{position:absolute;top:0}}.logoWrapper>svg{-o-object-fit:cover;object-fit:cover}}@supports (aspect-ratio: 384/384){.symbolWrapper{aspect-ratio:384/384}}@supports not (aspect-ratio: 384/384){.symbolWrapper{position:relative;width:100%;padding-top:100%}.symbolWrapper>*{position:absolute;top:0}}.symbolWrapper>svg{-o-object-fit:cover;object-fit:cover}.userIcon{border-radius:50%;-o-object-fit:cover;object-fit:cover;vertical-align:middle}.sizeSmall{width:24px;height:24px}.sizeMedium{width:32px;height:32px}.sizeLarge{width:64px;height:64px}@keyframes ticker{0%{transform:translate(0)}to{transform:translate(-100%)}}.ticker{width:100%;font-size:var(--size-font-18);color:var(--color-bg-1);display:flex;background-color:var(--color-bg-0);padding:4.5px 0;gap:0;-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow-x:hidden;flex-grow:0;flex-shrink:0}.ticker>*{font-family:Doto,sans-serif;font-optical-sizing:auto;font-weight:600;font-style:normal;font-variation-settings:"ROND" 0;white-space:nowrap;padding:0 8px}.ticker.slow>*{animation:ticker 20s linear infinite}.ticker.normal>*{animation:ticker 8s linear infinite}.ticker.fast>*{animation:ticker 4s linear infinite}.fileSelect{opacity:0;position:absolute;top:0;right:0;bottom:0;left:0;cursor:pointer}.urlCopyButton{width:48px;height:48px;color:transparent;background-color:var(--color-bg-1);border:2px solid var(--color-bg-0);overflow:hidden;transition:transform .1s ease-out}.urlCopyButton:hover,.urlCopyButton:focus{transform:scale(.9)}.shareIcon{width:24px;height:24px}.shareIcon>path{fill:var(--color-text-1)}.contentWrapper{width:100%;height:-moz-fit-content;height:fit-content;min-height:100%;display:flex;flex-direction:column}.container{width:100%;max-width:100%;background-color:#eee;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;overflow-x:hidden;flex-grow:1;gap:24px}@media (max-width: 519px){.container{padding:24px 16px}}@media (min-width: 520px){.container{padding:32px 24px}}.iconListWrapper{width:100%;border:3.5px solid var(--color-bg-0);margin:0 -4px;background-color:var(--color-bg-1);border-radius:8px}@media (max-width: 519px){.iconListWrapper{max-width:348px}}@media (min-width: 520px){.iconListWrapper{max-width:744px}.iconListWrapper.wide{max-width:984px}}.iconListWrapper:has(.iconListHeader){border-radius:0 8px 8px}@media (max-width: 519px){.iconListWrapper:has(.iconListHeader){margin-top:20px}}@media (min-width: 520px){.iconListWrapper:has(.iconListHeader){margin-top:28.5px}}.iconListHeader{width:-moz-fit-content;width:fit-content;color:var(--color-text-0);font-size:var(--size-font-16);font-family:Doto,sans-serif;font-optical-sizing:auto;font-weight:600;font-style:normal;font-variation-settings:"ROND" 0;white-space:nowrap;line-height:32px;padding:0 9px;margin-top:-32px;margin-left:-3.5px;background-color:var(--color-bg-0);border-radius:4px 4px 0 0;display:block}.iconList{display:flex;flex-wrap:wrap;box-sizing:border-box}@media (max-width: 519px){.iconList{min-height:120px;padding:24px 12px;gap:12px}}@media (min-width: 520px){.iconList{min-height:144px;padding:24px;gap:24px}}.iconList .iconWrapper{padding:6px;box-sizing:border-box}.iconList.withGrid{background:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20id='uuid-0b516715-f421-46dc-b677-f3e9066e439e'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2012%2012'%3e%3crect%20width='12'%20height='12'%20fill='none'%20stroke='%23eee'%20stroke-width='1'%20stroke-miterlimit='10'/%3e%3c/svg%3e") repeat left top/12px;border-radius:8px}.iconListEmpty{display:flex;justify-content:center;align-items:center}@media (max-width: 519px){.iconListEmpty{min-height:120px}}@media (min-width: 520px){.iconListEmpty{min-height:144px}}.footerWrapper{min-height:100px;display:flex;justify-content:center;align-items:center}.iconItemContainer{background-color:#eee;display:flex;flex-direction:column;align-items:center;flex-grow:1}@media (max-width: 519px){.iconItemContainer{gap:24px}}@media (min-width: 520px){.iconItemContainer{gap:32px}}.iconItemWrapper{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;background:#fff url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20id='uuid-0b516715-f421-46dc-b677-f3e9066e439e'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2012%2012'%3e%3crect%20width='12'%20height='12'%20fill='none'%20stroke='%23eee'%20stroke-width='1'%20stroke-miterlimit='10'/%3e%3c/svg%3e") repeat left top/12px;padding:24px;border:3.5px solid var(--color-bg-0);border-radius:8px;position:relative;overflow:hidden}@media (max-width: 519px){.iconItemWrapper{width:300px;height:300px}}@media (min-width: 520px){.iconItemWrapper{width:324px;height:324px}}.iconItemWrapper .urlCopyButton{position:absolute;bottom:12px;left:12px}.iconItemWrapper .symbolLink{position:absolute;top:12px;right:12px}.iconItemWrapper .symbolLink>a{text-decoration:none}.iconItemWrapper .symbolLink .symbolWrapper{width:-moz-fit-content;width:fit-content;height:-moz-fit-content;height:fit-content;transition:transform .1s ease-out}.iconItemWrapper .symbolLink .symbolWrapper>svg{width:48px;height:48px;vertical-align:middle}.iconItemWrapper .symbolLink .symbolWrapper:hover,.iconItemWrapper .symbolLink .symbolWrapper:focus{transform:scale(.9)}.iconItemWrapper .arrowR{width:504px;height:60px;background:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20id='uuid-54745235-8cce-4f55-a7ab-12edf6c8df79'%20data-name='レイヤー%201'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2084%2060'%3e%3cg%20opacity='.08'%3e%3crect%20x='24'%20y='48'%20width='12'%20height='12'/%3e%3crect%20x='24'%20y='0'%20width='12'%20height='12'/%3e%3cpolygon%20points='36%2024%200%2024%200%2036%2036%2036%2036%2048%2048%2048%2048%2036%2060%2036%2060%2024%2048%2024%2048%2012%2036%2012%2036%2024'/%3e%3c/g%3e%3c/svg%3e") repeat left top/84px 60px;position:absolute;left:0;animation:arrowLoop 4s steps(7,end) infinite}@keyframes arrowLoop{0%{transform:translate(-84px)}to{transform:translate(0)}}.iconItemImage{width:120px;height:120px;padding:.5px;box-sizing:border-box;display:block;cursor:default;z-index:1}.iconItemUrl{width:calc(100% - 64px);max-width:640px;text-align:center;word-break:break-all;display:flex;flex-direction:column;justify-content:center;flex-wrap:wrap;gap:6px}.iconItemUrl>a{line-height:1.6}.iconItemUrl>span{font-family:Roboto Mono,sans-serif;font-optical-sizing:auto;font-weight:400;font-style:normal;font-size:var(--size-font-15)}.iconItemOwner{position:absolute;top:12px;right:12px}.iconItemName{width:-moz-fit-content;width:fit-content;max-width:calc(100% - 35px);height:-moz-fit-content;height:fit-content;color:var(--color-text-0);font-size:var(--size-font-14);text-align:right;line-height:24px;padding:0 8px;position:absolute;right:11.5px;bottom:11.5px;background-color:var(--color-bg-0)}.iconItemMaker{width:-moz-fit-content;width:fit-content;max-width:calc(100% - 35px);height:-moz-fit-content;height:fit-content;display:inline-flex;align-items:center;position:absolute;left:12px;top:12px}.iconItemMaker .userIcon{border-radius:0}.iconItemMaker .iconItemMakerName{color:var(--color-text-0);font-size:var(--size-font-14);text-align:right;line-height:24px;padding:0 8px;background-color:var(--color-bg-0)}.iconItemRedirect{max-width:calc(100% - 88px);position:absolute;left:11.5px;top:15px;word-break:break-all}.iconItemRedirect>span{font-size:var(--size-font-15);line-height:36px;padding-bottom:5px;border-bottom:1px solid var(--color-text-1)}.iconItemRedirect:hover{z-index:10}.arrowIcon{width:30px;height:30px}.redirectContainer{position:absolute;top:0;right:0;bottom:0;left:0;justify-content:center;align-items:center}.spinner{width:48px;padding:8px;aspect-ratio:1;border-radius:50%;background:var(--color-border-ui);--_m: conic-gradient(#0000 10%,#000), linear-gradient(#000 0 0) content-box;-webkit-mask:var(--_m);mask:var(--_m);-webkit-mask-composite:source-out;mask-composite:subtract;animation:s3 1s infinite linear}@keyframes s3{to{transform:rotate(1turn)}}.iconMakeContainer{background-color:#eee;display:flex;flex-direction:column;align-items:center;flex-grow:1}@media (max-width: 519px){.iconMakeContainer{gap:24px}}@media (min-width: 520px){.iconMakeContainer{gap:32px}}.iconMakeContainer>form{display:flex;flex-direction:column;align-items:center}@media (max-width: 519px){.iconMakeContainer>form{gap:24px}}@media (min-width: 520px){.iconMakeContainer>form{gap:32px}}.iconMakeWrapper{height:-moz-fit-content;height:fit-content;text-align:center;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;background:#fff url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20id='uuid-0b516715-f421-46dc-b677-f3e9066e439e'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2012%2012'%3e%3crect%20width='12'%20height='12'%20fill='none'%20stroke='%23eee'%20stroke-width='1'%20stroke-miterlimit='10'/%3e%3c/svg%3e") repeat left top/12px;padding:24px;border:3.5px solid var(--color-bg-0);border-radius:8px;position:relative}@media (max-width: 519px){.iconMakeWrapper{width:300px;height:300px;margin:24px -4px 0}}@media (min-width: 520px){.iconMakeWrapper{width:324px;height:324px;margin:32px -4px 0}}.iconMakeWrapper .uploadMessage{font-size:var(--size-font-16);line-height:24px}.iconMakeWrapper .guideline{width:100%;font-size:var(--size-font-12);line-height:1;position:absolute;left:0;bottom:12px}.selectedImage{width:120px;height:120px;padding:.5px;box-sizing:border-box;pointer-events:none;z-index:1}.textInput{height:36px}@media (max-width: 519px){.textInput{width:300px}}@media (min-width: 520px){.textInput{width:324px}}.textInput>label{width:-moz-fit-content;width:fit-content;height:100%;color:var(--color-text-0);font-size:var(--size-font-12);line-height:36px;padding:0 8px;box-sizing:border-box;background-color:var(--color-bg-0);position:absolute;top:-36px;display:none}.textInput>input{width:100%;height:100%;font-size:var(--size-font-16);padding:4px;border:2px solid var(--color-bg-0);outline:none;box-sizing:border-box}.iconTitle{width:calc(100% - 48px);position:absolute;bottom:12px;transform:scale(0);transition:transform .2s ease-out .2s}.formItemWrapper{display:none;flex-direction:column;align-items:center;gap:32px;transition:transform .2s ease-out .2s;transform:scaleY(0)}.contentWrapper:has(.selectedImage) .iconTitle{transform:scale(1)}.contentWrapper:has(.selectedImage) .formItemWrapper{display:flex;transform:scale(1)}.pinnedItem,.myIcon{position:relative}.archivedItem{display:none}.archivedItem .iconImage{opacity:.4}.pinButtonWrapper{width:24px;height:24px;color:transparent;background-color:var(--color-bg-1);border-radius:50%;box-shadow:0 0 12px #0003;display:flex;justify-content:center;align-items:center;transition:transform .1s linear;position:absolute;top:-6px;right:-6px;overflow:hidden}.pinButtonWrapper>button{width:100%;height:100%;color:transparent;background-color:transparent;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.pinButtonWrapper:hover,.pinButtonWrapper:focus-within{transform:scale(1.1);outline:3px solid var(--color-blue)}.pinButtonWrapper:hover>button,.pinButtonWrapper:focus-within>button{outline:none}.remove:after{content:"";width:12px;height:2px;background-color:var(--color-text-1);position:absolute;pointer-events:none}.add:before,.add:after{content:"";width:12px;height:2px;background-color:var(--color-text-1);position:absolute;pointer-events:none}.add:after{transform:rotate(-90deg)}.myIconList{position:relative}.myIconList .iconList>li{position:relative}.iconList .pinned{display:none}.archivedSettingWrapper{width:-moz-fit-content;width:fit-content;color:var(--color-text-0);font-size:var(--size-font-16);font-family:Doto,sans-serif;font-optical-sizing:auto;font-weight:600;font-style:normal;font-variation-settings:"ROND" 0;white-space:nowrap;line-height:32px;padding:0 9px;background-color:var(--color-bg-0);display:block;-webkit-user-select:none;-moz-user-select:none;user-select:none}.visibilityButtonWrapper{width:22px;height:22px;color:transparent;background-color:var(--color-bg-1);border:1px solid var(--color-text-1);display:none;justify-content:center;align-items:center;position:absolute;top:-6px;right:-6px;overflow:hidden}.visibilityButtonWrapper>button{width:100%;height:100%;color:transparent;background-color:transparent;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.visibilityButtonWrapper:hover,.visibilityButtonWrapper:focus-within{border-color:transparent;outline:3px solid var(--color-blue)}.visibilityButtonWrapper:hover>button,.visibilityButtonWrapper:focus-within>button{outline:none}.hide:after{content:"";width:10px;height:7px;pointer-events:none;border-width:0 0 2px 2px;border-color:var(--color-text-1);border-style:solid;transform:rotate(-45deg);position:absolute;top:4px;left:5px}.archivedSettingToggle{display:none}.archivedSettingLabel{cursor:pointer}.archivedSettingLabel .isVisible{display:none}.archivedSettingLabel .isInvisible{display:block}.container:has(input:checked) .archivedItem{display:block}.container:has(input:checked) .isVisible{display:block}.container:has(input:checked) .isInvisible{display:none}.container:has(input:checked) .pinButtonWrapper{display:none}.container:has(input:checked) .visibilityButtonWrapper{display:flex}
